Canvas effects for React, copied into your project as source. Starts with ordered dither: fire, lightning, sonar rings, a light beam, a sloshing fluid, rain and snow.
The dither and ASCII renderers, every effect, and a barrel that re-exports them.
AsciiCanvas: fills its positioned parent with a canvas that draws any effect as coloured glyphs, in the system monospace or a font you pass.
Directional beam with drifting motes.
Intermittent lightning arcs on a randomised interval.
DitherCanvas: fills its positioned parent with a pixelated canvas that draws any effect as Bayer-dithered cells.
The frame loop, the Surface and FxEffect contracts, the useFx and useFxEngine hooks, seeded RNG and the colour helpers every renderer and effect builds on.
Rising flame front with embers.
Sloshing liquid level with rising bubbles.
Slanted streaks of rain, splashing on the floor.
Concentric rings pulsing out from an anchor.
Drifting flakes settling into a drift along the floor.
Tracks the prefers-reduced-motion media query without tripping hydration.