Skip to the tool

Website widgets

A live clock, countdown, world clock, or Pomodoro for another website.

Digital clock

The clock follows the visitor's device time unless the embed URL names a time zone. It does not use the clock saved in this browser.

<iframe src="https://clockbeam.com/embed/clock/?preset=minimal-dark" title="Clockbeam digital clock" width="520" height="200" loading="lazy" style="border:0;max-width:100%;"></iframe>

Change this clock in the builder

Countdown timer

Each visitor starts their own countdown. It is not a shared remote for a live audience. For a stream, use the OBS countdown instead.

<iframe src="https://clockbeam.com/embed/timer/?preset=minimal-dark&amp;duration=300" title="Clockbeam countdown timer" width="520" height="300" loading="lazy" style="border:0;max-width:100%;"></iframe>

Change this countdown in the builder

World clock

The cities in the URL are the cities the visitor sees. Their saved world clock on Clockbeam stays separate.

<iframe src="https://clockbeam.com/embed/world-clock/?preset=minimal-dark" title="Clockbeam world clock" width="520" height="440" loading="lazy" style="border:0;max-width:100%;"></iframe>

Choose cities in the builder

Pomodoro

Focus, short break, and long break lengths travel in the URL. The session starts when the visitor presses Start.

<iframe src="https://clockbeam.com/embed/pomodoro/?preset=minimal-dark" title="Clockbeam Pomodoro timer" width="420" height="340" loading="lazy" style="border:0;max-width:100%;"></iframe>

Change this Pomodoro in the builder

A livestream needs a browser source, not one of these iframes. Use the OBS clock, OBS countdown, or starting soon countdown.

How to use it

  1. Check the live clock, countdown, world clock, or Pomodoro on this page. Each preview is the widget a visitor would see.
  2. Copy the iframe under that preview, or open it in the widget builder to change colors, size, cities, or the countdown length.
  3. Paste the iframe into the other site. The visitor gets that widget. Your saved setups on Clockbeam stay on this browser.

Limits to know

  • A host page that blocks iframes shows an empty box. The widget cannot be pasted as loose HTML.
  • Each visitor starts their own countdown or Pomodoro. This is not a remote control for someone else's screen.
  • The small Clockbeam link is on by default and uses rel="nofollow". Turn attribution off in the builder to remove it.
  • A countdown sound needs the visitor's tab to stay open. The widget does not run in the background.

Questions

Does the website clock use the visitor's time zone?

Yes, unless the embed URL names a time zone. The visitor's saved clock settings on Clockbeam are not used.

Does each visitor get their own countdown?

Yes. The countdown starts in that browser when they press Start. It is not a shared live countdown.

Can I hide the Clockbeam link on a widget?

Yes. Turn attribution off in the widget builder, then copy the iframe again. The default link reads Clockbeam and uses rel="nofollow".

Related tools