[component library]

Overview

Browse interactive components with live previews. Open any item to copy the source or grab an AI prompt.

Components: 6 components
Categories: 4 categories

[Backgrounds]

3 components

Where creativity meets code.
[Backgrounds]
Smoke Background
Animated WebGL2 smoke noise background with a customizable tint color. Runs in a canvas with ResizeObserver-based sizing.
View
Where creativity meets code.
[Backgrounds]
Etheral Shadow
Animated shadow overlay with SVG displacement filters, hue rotation, and optional film grain noise. Masked typography sits above the effect.
View
Where creativity meets code.
[Backgrounds]
GLSL Hills
Animated Three.js terrain with GLSL simplex noise displacement. Rolling hills fade into the distance with configurable camera and animation speed.
View

[Inputs]

1 component

50
[Inputs]
Animated Slider
Radix UI slider with an animated NumberFlow value label above the thumb. Smooth digit transitions on drag.
View

[Badges]

1 component

[Badges]
Award Badge
Product Hunt-style award badge with 3D tilt on hover, rainbow overlay animation, and configurable award type and placement.
View

[Typography]

1 component

Bodhi's Lab
Where creativity meets
code.
Motion, shaders, and interfaces — crafted one experiment at a time.
[Typography]
Fade Up Text
Staggered hero typography with badge, gradient headline, and supporting copy — each block fades up with blur using Framer Motion.
View