library

effects

mcp

glass widget wall

pro

Get the prompt, project and Figma file with monthly ($29 a month) or yearly ($249 a year). Plus tax where it applies.

A 1080 × 1080 motion study: four columns of rounded frosted-glass widgets drift over a dark backdrop of soft grey-blue discs and one warm orange glow, two columns up and two down, each passing one full set every 16 seconds so the loop never shows a seam. Steps 8,426, a 12:48 timer with a turning ring, Lisbon at 24° with an hourly forecast, Low Tide by Nora Vale with an orange equaliser, battery, network with breathing signal bars, a beating heart at 72 bpm, an analog clock with a sweeping second hand, the November 2026 calendar, a Focus toggle that switches on and off, a sleep hypnogram, activity bars, a sliding brightness pill, water glasses, air quality, headphones, the sun moving along its arc, a heating dial, a waxing moon, a morning run whose route draws itself, a 07:30 alarm and a wind compass with a swaying needle. The frost is drawn, not filtered: a blurred, darker copy of the backdrop is redrawn every frame on a canvas clipped to every widget's rounded box, under a faint gradient, a 1-px rim and a film grain. HTML, SVG, CSS animations and Canvas 2D with React, Geist and Geist Mono, Lucide icons, a stage that scales to fit any window, and frame-exact rendering (window.__render(t) sets the CSS loops too, plus a ?rec mode).

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

  • widgets
  • dashboard cards
  • frosted glass
  • calendar
  • analog clock
  • dial
  • toggles
  • autoplay loop
  • frame-exact recorder

stack

  • react
  • vite
  • typescript
  • canvas
  • svg

fonts

Geist, Geist Mono

Free fonts, linked in the prompt.

colors

  • #04060B
  • #FFB866
  • #FF8A3C
  • #AAB8CC
  • #8496AD
  • #FFFFFF

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