Loading…
Live page · scroll inside
Freecoming-soon · dark · html · css · vanilla js
Flip Countdown
A coming-soon page built around a split-flap countdown: four cards for days, hours, minutes and seconds, each digit pair flipping down like a departures board when it changes, under a one-line promise and a notify-me form that validates, shakes on a bad address and draws a tick on success. No library, one file, a fictional studio as placeholder copy.
What's inside
- 01Countdown heroSplit-flap digits flip down on change; the top half tints toward the accent during the flip.
- 02Notify meFocus ring glow, shake on invalid, tick draws on success.
How to use it
From prompt to a live page.
- 01Try the page
The preview is the shipped page: one job, one mechanic, every state wired. Scroll, type, click.
- 02Pick a palette
Token sets re-tint the page live. The prompt carries the one you chose.
- 03Pick your stack
Single HTML, or the route your framework keeps for this job: not-found page, auth route, pricing route.
- 04Copy the prompt
It quotes the page block by block with the tokens, the motion script and the rules.
- 05Wire it up
Swap the placeholder copy, point the form or the countdown at your backend, keep the structure.
