Digital Clock Widget

Add a large, readable digital clock to your website showing your visitors' own time or the time in any city, with the date and the current UTC offset underneath.

Time & Date Clock & time Runs in your browser Free · no ads

Customize your widget

Theme
Auto follows the visitor's light/dark setting.
Style
Attribution on your page
Optional and entirely your choice. The exact line is shown in the code below; it links to the tool with rel="nofollow".
More options
Starting values
Leave blank to use the widget's defaults. Visitors can still change every value.

Live preview

Exactly what your visitors will see

Embed code

<iframe src="https://a2z.tools/embed/w/digital-clock" title="Digital Clock by A2Z Tools" width="100%" height="310" style="border:0;width:100%" loading="lazy" allow="clipboard-write"></iframe>

A plain iframe. Works everywhere, including site builders that strip scripts. Adjust height if your content needs more room.

Works with

How it works

The clock formats the current moment in the chosen IANA time zone using the browser's built-in time-zone database, which already knows every daylight-saving rule, so the display changes correctly on the night clocks go forward or back. It checks the time four times a second and only redraws when the displayed second changes, which keeps the seconds in step with the real second boundary. Visitors can switch between 12- and 24-hour time; screen readers get the time and date as text, updated once a minute rather than every second.

Method

  • Displayed time = Intl.DateTimeFormat(timeZone = IANA zone).format(now), recomputed on every tick
  • UTC offset = wall-clock time in the zone - UTC time at the same instant
  • Without v_zone the visitor's own device zone is used

Limitations

  • No alarm, stopwatch or chime - it only displays the time.
  • Month and weekday names follow the visitor's browser language, so a Hindi-language browser shows Devanagari month names while the digits stay Latin.
  • Tenths of a second are never shown; the display changes on whole seconds only.
  • One zone per clock; for a list of cities use the World Clock, and for converting a planned time use the Time Zone Converter.
  • If the device clock is wrong the display is wrong; the widget does not correct it from a time server.

Where publishers use it

  • A company intranet or status page showing head-office time
  • Radio, streaming and live-event pages that announce schedules in one zone
  • Travel agencies showing the destination's local time next to an itinerary
  • Classroom and exam pages that need a large, legible clock

Questions

Which time does it show by default?

The visitor's own local time. Add v_zone=Asia/Tokyo (any IANA name) to show a fixed city, and v_label to name it.

Can I hide the seconds or the date?

Yes: v_seconds=0 hides the seconds and v_date=0 hides the date line.

Is it accurate?

It is as accurate as the visitor's device clock, which phones and computers normally synchronise over the internet. The widget makes no network requests.

Why did the offset under the clock change?

The line shows the zone's current offset, so it moves when daylight saving starts or ends: Los Angeles shows UTC-7 in summer (PDT) and UTC-8 in winter (PST). Zones without daylight saving, such as Asia/Tokyo, always show the same offset.

Sources

  1. Time Zone Database (tz / zoneinfo) - IANA . Offsets and daylight-saving rules behind v_zone
  2. ECMAScript Internationalization API Specification (ECMA-402) - Ecma International TC39 . Intl.DateTimeFormat, which formats the digits, weekday and month in the visitor's language

Cite or recommend this tool

If you reference this tool in an article, course or documentation, these formats are ready to copy. They are optional - nothing is added to your site unless you paste it.

A2Z Tools Digital Clock
https://a2z.tools/embed/digital-clock

Related widgets

More Time & Date widgets →

Preview

CustomizeGet code