Build lazily.
Lazy-ui is an open-source collection of 42 React components built to add visual personality to your projects — WebGL backgrounds, text and motion effects, device mocks, and a few focused interactive primitives.
It is not a generic UI kit. You won’t find another button or input family here. Lazy-ui exists to help your pages stand out without rebuilding the visual heavy lifting from scratch.
Mission
Ship visually striking React components that you can own, customize, and adopt one at a time.
You own the code.
Source files land in your repo under components/lazy-ui. Modify, rename, or extend without waiting on a package release.
Tune through props.
Every component exposes the knobs that matter — palette, speed, intensity, easing — so most adjustments never need a code dive.
No bundle, no lock-in.
Lazy-ui isn’t on npm. Pull only the components you need via the shadcn CLI — no transitive deps, no unused code shipped.
Themable by default.
The default surface is dark, but every component is built on Tailwind and exposed props — swap colors, easing, or type to match the design system you already have.
Performance
Most Lazy-ui pieces are GPU-accelerated WebGL or motion effects. A few things to keep in mind when you wire them in.
One or two per page.
Stacking multiple WebGL surfaces on a single screen will compete for the GPU and dilute the visual focus. Pick the hero piece; keep the rest static.
Downgrade gracefully.
On smaller viewports or older devices, swap heavy effects for a static fallback. Image posters and CSS gradients carry most of the visual weight at a fraction of the cost.
Respect the preference.
Components honor prefers-reduced-motion and short-circuit decorative loops. Verify on a real device before shipping.