dawn alarm
proGet the prompt, project and Figma file with monthly ($29 a month) or yearly ($249 a year). Plus tax where it applies.
A round bedside alarm floats and sways slowly in a pale room, drawn in CSS 3D: a warm matte ceramic face over 28 stacked discs that give the body its depth, a knurled bezel of 180 grooves with an orange marker, a recessed dark glass screen. The screen shows the date and "22:41" in Geist Mono, "WAKE AT" in orange, the wake time in thin Geist Light, the time left until it, and a curved hour scale at the bottom that scrolls under a fixed orange marker. The 16-second seamless loop: the bezel turns and the wake time rolls from 07:15 to 06:30 with the scale scrolling along; an "ALARM SET ✓" pill rises in; the screen dims into night mode and stars come out; then the sunrise: the screen glows from deep red to peach, a sun disc rises from the bottom, the type turns dark brown and says "GOOD MORNING" and "Slept 7h 49m", and the room warms with an orange glow; the light fades, the screen goes dark while the bezel turns home, and the evening state comes back. The screen is a canvas drawn every frame; the bezel is drawn once and turns. ?rec and window.__render(t) draw any moment for frame-exact video export, and reduced motion gets one still.
what you get
- prompt
- Paste it into Claude, Codex, Kimi or Cursor to rebuild this template. Tested: we rebuild every template from its prompt before it goes live.
- project
- The Vite + React source code as a .zip, ready to run.
- figma file
- The editable design as a .fig file to import into Figma.
what's inside
- sunrise alarm
- smart home device
- product render
- css 3d
- stacked layers
- knurled bezel
- round screen
- curved scale
- rolling time
- night mode
- starfield
- sunrise gradient
- ambient glow
- float and sway
- canvas 2d
- autoplay loop
- frame-exact recorder
stack
- react
- vite
- typescript
- canvas
fonts
Geist, Geist Mono
Free fonts, linked in the prompt.
colors
- #E9E5DF
- #F4EFE7
- #C8BFB1
- #0F0D0C
- #E8603A
- #FF965A
- #3A1A0C
- #FFF8E1
license
With monthly or yearly: personal and commercial work, client projects included. Don't resell or share the template, prompt or files.
read the license

