Free embed widget

Free Timezone Planner Widget — Embed on Any Website

Add a timezone overlap widget to your blog, Notion workspace, or company site. Free, no signup. Paste one line of HTML.

Explaining timezone pain to your readers or team is hard. An interactive widget does it instantly — show exactly when people's working hours overlap, which slots cause the least discomfort, and how your team spans the globe. Copy the embed code below and paste it anywhere that accepts HTML.

Live demo

Embed code (demo team)

<iframe
  src="https://www.timeoverlap.fyi/en/embed?s=JTdCJTIycGFydGljaXBhbnRzJTIyJTNBJTVCJTdCJTIyaWQlMjIlM0ElMjJwMSUyMiUyQyUyMm5hbWUlMjIlM0ElMjJOZXclMjBZb3JrJTIyJTJDJTIydGltZXpvbmUlMjIlM0ElMjJBbWVyaWNhJTJGTmV3X1lvcmslMjIlMkMlMjJ3b3JrU3RhcnQlMjIlM0E5JTJDJTIyd29ya0VuZCUyMiUzQTE4JTdEJTJDJTdCJTIyaWQlMjIlM0ElMjJwMiUyMiUyQyUyMm5hbWUlMjIlM0ElMjJMb25kb24lMjIlMkMlMjJ0aW1lem9uZSUyMiUzQSUyMkV1cm9wZSUyRkxvbmRvbiUyMiUyQyUyMndvcmtTdGFydCUyMiUzQTklMkMlMjJ3b3JrRW5kJTIyJTNBMTglN0QlMkMlN0IlMjJpZCUyMiUzQSUyMnAzJTIyJTJDJTIybmFtZSUyMiUzQSUyMlNpbmdhcG9yZSUyMiUyQyUyMnRpbWV6b25lJTIyJTNBJTIyQXNpYSUyRlNpbmdhcG9yZSUyMiUyQyUyMndvcmtTdGFydCUyMiUzQTklMkMlMjJ3b3JrRW5kJTIyJTNBMTglN0QlNUQlMkMlMjJtZWV0aW5nRHVyYXRpb24lMjIlM0E2MCUyQyUyMmRhdGUlMjIlM0ElMjIyMDI2LTA2LTA4JTIyJTdE"
  width="100%"
  height="500"
  frameborder="0"
  title="Timezone Overlap Planner"
  loading="lazy"
></iframe>

To embed your own team, open the planner, configure your participants, then click the Embed button to get a personalised code.

How to embed

1

Configure your team

Open the Timezone Overlap Planner, add your team members with their timezone and working hours.

2

Click Embed

Hit the "Embed" button in the top toolbar. Choose your preferred widget width.

3

Copy & paste

Copy the generated <iframe> snippet and paste it into your blog post, Notion page, team handbook, or any HTML page.

Use cases

Remote team handbooks

Show your team's live timezone coverage directly in your Notion or Confluence team page.

Blog posts & articles

Writing about distributed work or remote teams? Embed a live overlap visualization for your readers.

Job listings

Let candidates see your team's timezone distribution before applying — sets expectations upfront.

Company websites

"We are a remote-first team across 4 timezones" — show it, don't just say it.

Frequently Asked Questions

Is the embed widget free?

Yes. The widget is completely free with no signup, no API key, and no attribution requirement.

Does the embedded widget update in real time?

Yes. Participant local times update live. The overlap window is recalculated automatically for the current date.

Can I configure which team is shown?

Yes. Open the planner, set up your team, then click Embed. The widget encodes your full team configuration in the URL — change the team, get a new embed code.

Will it work in Notion?

Yes. Paste the URL into a Notion page and use /embed or the bookmark block. Notion renders iframes from external sites.

What size should the iframe be?

The default height of 500px works well for 2–4 participants. For larger teams, increase the height. Width of 100% (responsive) is recommended for most use cases.

Ready to embed?

Configure your team in the planner, click Embed, copy the code.

  • Free, no signup
  • Works in Notion, blogs, HTML pages
  • Responsive widget, dark mode supported
Open Timezone Planner