Badge Countdown

A name-badge card that counts down to a date. It shows days, hours and minutes (seconds are optional), switches to a "Happening now" message while your event runs, and to a closing line once it is over.

Set the start and end as plain local times, YYYY-MM-DDTHH:MM, and pick the time zone by its IANA name, for example Europe/Amsterdam or Asia/Seoul. Every visitor sees the same countdown to the same moment, wherever they are, and clock changes are handled. On the night clocks go back, a time that happens twice means the first one; add an offset like -05:00 to pick the second. Leave the end empty for a single moment. It runs on its defaults, so you can drop it on a page and watch it count first.

Everything else is in the properties panel: the three messages (before, during, after), which units to show, large or compact size, left, center or right alignment, seven colors, and the fonts for the message and the digits. Digits are tabular, so the card does not jiggle while it ticks, and it never gets narrower when 100 days becomes 99.

It stops updating while the browser tab is hidden and catches up when you come back. Screen readers hear the time once a minute, never every second. It fills its container and keeps a clean layout on narrow screens. Works in any Framer plan. Free for personal and commercial projects.

See it in a full site: the preview is the home page of our Lanyard template: https://www.framer.com/marketplace/templates/lanyard/