Door Sign

A one-line badge that tells visitors whether your studio is open right now. It shows "Open" or "Closed" from your own opening hours, the time in your city, how far that is from the visitor's clock ("8h behind you", "5h ahead of you" or "same time as you"), and an optional "Booking from..." line with four dots for how many slots are left.

Everything is worked out in the browser with the time zones it already has, so daylight saving is handled in both places and nothing is fetched. The clock moves once a minute. A wrong time zone name falls back to UTC without errors.

Set it up in the properties panel: city, time zone (IANA name such as Europe/Lisbon), first and last working day, opening and closing hour (half hours work, and a closing hour before the opening hour counts as a night shift), the booking text and the number of open slots from 0 to 4. Clear the booking text to drop that part. Pick one of three skins: Outline, Pill or Tint. Four colors and two fonts. It runs on its defaults, so you can drop it on a page and try it first.

It sizes to its content and wraps onto two rows in a narrow container instead of clipping. The dots have a text label for screen readers. In the Framer canvas it shows a fixed 10:24 and Open, so your layout stays steady while you edit. Works in any Framer plan. Free for personal and commercial projects.

The preview shows the component on its own, so you can try the skins and settings without a whole site around it. It was built for our Retainer template: https://www.framer.com/marketplace/templates/retainer/