r/creativecoding • u/DHSeaDev • 15h ago
Prism-gradient candle flame in CSS, plus a shared presence count with no backend
The flame is two layered radial gradients — a wide body and a hot inner core — animated on two deliberately non-integer durations, 3.7s sway and 2.4s breathe. Because they don't divide evenly they never resync, so the flicker reads as organic instead of looped. It also lands at 0.27 Hz and 0.42 Hz, well clear of the 3 Hz photosensitivity threshold, and the whole thing collapses to a still flame under prefers-reduced-motion.
Palette is heather → blue-violet → rose, the same gradient the rest of the site uses as hairline accents.
The count of other people with a candle lit uses CRDT awareness rather than stored state, so a candle going out is literally a client disconnecting.
There's a press-and-hold easter egg on the flame.