How Flip Clock AI Works: Clock, Zones and Sound

The display runs off your device clock

The clock face does not count seconds itself. It reads the time from your device's system clock — the same clock that feeds your operating system's menu-bar clock — and redraws the flip digits once per second. Nothing is fetched from a time server, so the page behaves the same on flaky Wi-Fi as at home, and its accuracy is exactly the accuracy of the device you set it on. Set the device right and the clock is right.

The timer, stopwatch and pomodoro avoid a common trap. Instead of adding one second per tick — which drifts when a browser throttles a background tab — they note a timestamp when you start and compute elapsed time from the clock every frame. A stopwatch left running for an hour in a background tab still reports the correct total when you come back to it.

Time zones come from the browser's database

The world clock never hard-codes GMT offsets or daylight-saving rules. It passes IANA zone identifiers such as Europe/Paris or America/New_York to the browser and lets the browser's copy of the IANA Time Zone Database compute the offset, including daylight saving changes, which are calculated rather than observed by hand. Because the data ships with the browser itself, it stays current through normal browser updates; there is nothing inside the app to refresh.

IANA Time Zone Database — the registry browsers implement · MDN — Intl, the browser API that exposes it

The alarm sounds are synthesized, not downloaded

The five alarm sounds — Chime, Beep, Arp, Bell and Pulse — contain no audio files. Each one is generated the moment it plays with the browser's Web Audio API: oscillators and volume envelopes are assembled in memory on the fly. There is no sound pack to download, so the alarms are small to ship and cannot fail to load, and the volume is produced locally on your device.

MDN — Web Audio API

Caching and offline use

Flip Clock AI is a static app with a service worker. On your first visit the service worker caches the app shell — the pages and assets that make the site run. After that, pages you have opened load without a network connection, which is what makes an installed fullscreen clock usable on flaky Wi-Fi or with the network unplugged. The cache is refreshed as you keep using the site, so improvements reach you on your next page load.

MDN — Service Worker API

Fullscreen, wake lock and background tabs

Entering fullscreen uses the browser's Fullscreen API. The controls fade out after a few idle seconds and return on mouse movement, so the digits sit in clean silence. While the clock is fullscreen and the browser supports it, the page automatically holds a Screen Wake Lock — the operating system is asked not to sleep the display, with no toggle to find. When you leave fullscreen or minimize the window, the lock is released and normal behavior resumes.

Browser throttling of background tabs does not affect correctness. Elapsed time is computed from timestamps rather than by counting ticks, as described above, and a timer page that was backgrounded for an hour shows the right remaining time the moment you return.

WHATWG — Fullscreen Living Standard · MDN — Screen Wake Lock API · W3C — Page Visibility recommendation

Storage and privacy

Every setting — skin, accent, background, digit size, format, seconds — is written to browser local storage under keys belonging to this site. A custom background image is stored as a data string in the browser. Clearing site data returns everything to defaults; there is no server copy to delete or resurrect. The starting point is the privacy policy.

MDN — Web Storage (localStorage) · Flip Clock AI privacy policy