Embed a clock on your website
Pick a style, set the time zone, copy one snippet. The clock runs inside an iframe, so it never touches your page CSS or scripts. No signup, nothing to install.
Flip cards
Plain digits
How to add it
- 1
Copy the code
Use the button above. The snippet is plain HTML — no build step, no package to install.
- 2
Paste it into your page
Anywhere that accepts raw HTML: a custom HTML block, a code block, or the template file of your theme.
- 3
Save and reload
The clock appears right away. Nothing else to configure, and nothing to update later.
Where it works
Use a Custom HTML block, or paste it into a text widget.
Add a Code Block to the page and paste the snippet inside.
Type /embed and paste the iframe address, not the whole snippet.
A clock widget that does not slow your page down
Most clock widgets ship a JavaScript library, a web font, and a request to a third-party server. This one is a single HTML file of about 5 KB compressed, with the styles and the logic inlined. It loads in an iframe, so it cannot change your page CSS, cannot block your scripts, and cannot read anything your visitors type.
Two styles are available. Flip cards reproduce the split-flap display of old railway departure boards, where each digit falls forward with a soft shadow. Plain digits drop the cards and show large tabular numerals, which suits article pages and dashboards better. Both are drawn at the same scale, so switching between them does not shift your layout.
You can pin the clock to any IANA time zone, or leave it on the visitor local time. Daylight saving comes from the browser own time zone database, so a clock set to Europe/London follows the BST switch without any update on our side.
The embed is free and stays free. There is no account and no watermark.
Frequently asked questions
Is the clock widget really free?+
Yes. No account, no payment, no watermark, and no limit on how many clocks you embed. The link under the clock is the only thing we ask you to keep.
Do I have to keep the Clockhub link?+
It is not enforced and the clock works without it. But it is the only thing that keeps the project funded, so we ask you to leave it in place. It is already included in the snippet you copy.
Will the iframe slow down my page?+
The whole embed is about 5 KB compressed, less than a single photo. It is also marked loading="lazy", so browsers do not fetch it until it scrolls near the viewport.
Does it work with WordPress, Squarespace, and Notion?+
WordPress and Squarespace accept the full snippet in a custom HTML or code block. Notion is different: it embeds a URL rather than raw HTML, so paste only the iframe address into a /embed block — the attribution link will not appear there.
Can I show a different time zone?+
Yes. Pick a zone in the configurator and the snippet carries it as a tz parameter. Any IANA name works, for example Asia/Tokyo or America/New_York.
Does it still show the right time if my visitor's device clock is wrong?+
No. The clock reads the visitor device time and converts it to the chosen zone, so a device with a wrong clock shows a wrong time. Serving authoritative time would need a server call on every page load, which we deliberately avoid to keep the embed this small.