Skip to content

Components

Components that tell you what they cost.

3D, generative 2D, motion and interface components for React. Every one is copy-paste, customisable in place, and honest about its bundle weight, main-thread cost, reduced-motion behaviour and accessibility — the four things component libraries never tell you.

24 components23 with zero dependenciesEvery one has a considered reduced-motion state

Components built on React Three Fiber and hand-written GLSL: refraction, GPU instancing, displacement. These are the pieces that make a page feel like it was built rather than assembled — and the ones most likely to wreck your frame budget if used carelessly, which is why each states its cost up front.

Abstract, reactive surfaces to sit behind content: flow fields, metaballs, dithering, mesh gradients. All are seeded and deterministic, so what you see in the preview is what renders in your build — no two visitors get a different composition unless you ask for one.

Motion

All 6

Not components so much as behaviours — reveal, scramble, magnetise, parallax. Each takes arbitrary children, so they compose onto the interface you already have instead of asking you to adopt a new one.

Interface

All 6

Command palettes, disclosure, navigation, feedback. Nothing exotic — but built with the focus management, keyboard handling and reduced-motion paths that make the difference between a component that demos well and one that survives real use.