A huge thin ring behind the content with a lit arc and a bright head: progress, an hour of the clock, or a countdown.

Made as a Kadal Deck premium background, it fills whatever box you give it at its real size, in light and dark, and follows your brand colour (the --deck-accent CSS variable). Settings: mode (value: one arc that draws in on arrival · clicks: one arc per click · timer: a full ring that empties over `seconds`), arc (the lit arc in turns: "0.66" from twelve o'clock, or "from:to", "0.875:1.042" is 21:00–01:00 on a day dial; with mode clicks, one per click separated by |), seconds (with mode timer: how long the ring takes to empty), ticks (marks round the ring, 24 for a day, 60 for a minute; every quarter is longer), thickness (the ring's line, in % of its size), color (the arc's colour; the track is the same, faint), center (where the ring's centre is: "x,y" in % of the stage) and radius (the ring's radius in % of the stage's height). The animation pauses off screen and in background tabs, and holds still for visitors who ask for reduced motion.

What you get: a web component, one script with no framework, for a plain page, Webflow, WordPress or Framer, drawing behind your own content. A React component. Stills at 2560 x 1440 in light and dark, and transparent ones to lay over a photo. Seamless 10-second loops at 1920 x 1080, MP4 and WebM, for any video editor, and WebMs with transparency for overlays. A demo page to try the settings and print a PDF, and a README with a recipe for each.

In Kadal Deck, buying it unlocks Countdown Ring in every workspace you belong to (as background pro/countdown-ring). Pro, Team and Lifetime plans include every premium background already.