Free world clock widget for your website

A city’s time and sky,
live on your own page.

A clock for any of Meridian’s 650 cities, with the day’s sky from night through dawn to dusk, sunrise and sunset, and a line for now. Copy two lines of HTML and it looks after itself.

Make your own

Tokyo’s time and today’s sky, live on your own site. Paste the HTML into any page, or the link into Notion.

HTML

<iframe src="https://meridian-clock.com/embed/time/tokyo?size=square&theme=auto" width="300" height="300" style="border:0;border-radius:16px" title="Time in Tokyo" loading="lazy"></iframe>
<p><a href="https://meridian-clock.com/time/tokyo">Time in Tokyo</a>, sunrise and sunset by Meridian</p>

Link, for Notion’s /embed

Keep the line under the clock: it tells your readers where the time comes from. More about the clock

Pick a city

Every city page has the same panel. Here are the best-known; find any other on the world clock.

Questions

How do I add the clock to my site?

Copy the HTML from any city’s page and paste it where the clock should go: a Custom HTML block in WordPress, a Code block in Squarespace, an Embed element in Wix, or straight into your own page. In Notion, type /embed and paste the link instead.

Does it keep itself up to date?

Yes. It shows the right time as soon as it loads, moves on every minute, and draws the new day’s sky at local midnight. Clock changes for daylight saving are already in it.

What sizes and themes are there?

A 300 × 300 square, and a banner 130 pixels tall that fills the width you give it. Each comes dark, light, or set to follow your visitor’s own light or dark setting.

Can I put it in a GitHub README?

Not as a live clock: GitHub doesn’t allow frames and keeps its own copy of images, so the time would stop. Link to the city’s page instead.