How do I add a digital clock widget to my website?

Customize the clock, copy the iframe code, and paste it into your website HTML where you want the clock to appear.

Is the digital clock widget free?

Yes, the digital clock widget is free to use on websites.

Can I change the time zone?

Yes, you can choose visitor local time or a specific time zone such as New York, London, Paris, Tokyo, Sydney, or UTC.

Does the widget work on WordPress?

Yes, you can paste the iframe code into a Custom HTML block in WordPress.

Can I customize the colors and size?

Yes, you can customize the background color, text color, accent color, font size, width, height, border radius, and shadow.

Back to Widgets

Digital Clock Widget

Free Website Widget. Create a customizable Digital Clock widget and embed it on your website with a simple iframe code. It shows the current time.

Live Preview

See exactly how your widget will look before copying the embed code

Embed Code

Open Preview

<iframe
  src="https://www.smartclocktools.com/embed/digital-clock?title=Local+Time&timezone=local&format=24&showSeconds=true&showDate=true&showWeekday=true&background=%23ffffff&textColor=%23111111&accentColor=%23424752&font=system-ui&fontSize=32&borderRadius=12&shadow=none&width=320&height=160&language=en"
  width="320"
  height="160"
  loading="lazy"
  style="border:0;overflow:hidden;"
  title="SmartClockTools Widget"
></iframe>

Customize

Presets

Time formatTitleAdd a city name or custom label above the clockBackground

Text color

Accent color

FontFont size: 32Timezone

LanguageBorder radius: 12ShadowWidth (px)Height (px)

How to embed the digital clock widget

Customize the clock settings, copy the generated iframe code, and paste it into the HTML area of your website. The widget works without installing extra scripts or creating an account.

Where to use this clock widget

This widget is useful for business websites, school pages, event pages, travel blogs, dashboards, support pages, and websites that need to show the current time in a specific city or time zone.

Why use an iframe clock widget

An iframe keeps the clock isolated from your website code, which makes it simple to embed and easier to maintain. The widget settings are stored in the URL, so the same code always recreates the same clock design.

Frequently Asked Questions

Customize the widget using the settings above, preview the result, and copy the generated iframe code when you are ready. The embed code can be added to websites and website builders that support HTML or iframe embeds.