Collection of stunning components built with Tailwind CSS, shadcn/ui and Motion to use on your websites.
An account card that morphs into its own menu, with account switching, status, theme and hold-to-sign-out.
A contribution heatmap that tilts up into a 3D terrain you can turn, built with React and canvas.
How full the context window is, as a ring in the prompt footer that opens a breakdown by source and compacts when it fills.
A coding agent's edits streaming in file by file, then reviewed per file with accept, reject and undo.
An answer with source chips beside each claim. One preview glides between chips and lights up the sentence it backs.
AI search input with Quick and Research modes and a live trace underneath that stacks each source as it is read, times the run and opens into the full source list. Built with React, Tailwind CSS and Motion.
AI chat input with a model menu, a separate Effort control, file chips you can drop or paste, a / command menu, and Stop while replying.
Pick a model and how hard it thinks. Effort is a detent track that reshapes for each model and keeps your level when you switch.
Agent progress as a list of steps with a live log, elapsed time and a summary when done.
AI thinking text with a soft wave through the letters and words that swap letter by letter.
Approve or deny an agent's tool calls. Destructive calls need a press and hold, and decided calls fold into a trace with their output.
Voice input with a scrolling waveform, then a take you can play back, discard or send.
Activity rings that draw with a count-up, lap past 100% with a shadowed end cap and dim to focus, built with React and Motion.
Generated avatars from a name, morphing as you type, on a 3D coin you can flick, tap or shuffle.
A ribbon of lines in one color that keeps flowing at any size and parts around the cursor.
A subscribe button whose bell swings and rings, with a clapper that really strikes.
Keyboard shortcut button with a Command icon, hover shimmer sweep, and smooth CSS transitions, built with React and Tailwind CSS.
⌘K command palette with nested pages, fuzzy matching and in-row progress for running actions.
A headline hung like a Newton's cradle, so a knock on one letter clacks through the word, built with React and pendulum physics.
Transfer tracker that converts the amount in place, walks through each step on a filling rail, and ends with a copyable reference. Built with React and Tailwind CSS.
Rotary knob that clicks from notch to notch and coasts when flicked, built with React and Motion.
A halftone dot membrane that ripples behind a swipe and rings out from a click, built with React and Canvas.
A pleated curtain in a breeze that you can push and pull, built with React, WebGL and a cloth simulation.
Morphing text where shared letters travel, old ones fall and new ones land, with decode and cycle modes.
Zinc 3D extruded text lit by your pointer, with letters that press in like keycaps.
Drag and drop file upload with animated progress, file validation and error states. Built with React, Tailwind CSS and Motion animations.
A two-sided card you spin with a drag or a flick, with thickness, light and a floor shadow that follow the angle.
Flat text that cuts into hard-shifted bands with a thin red/cyan split, on idle, hover or text change.
Layered gradient button with emerald, purple, and orange variants, a gradient border in light and dark mode, soft inner glow, press feedback, and an optional icon, styled entirely with Tailwind CSS in React.
Any image, or a lit sphere, printed as a halftone dot screen, with a loupe that looks closer under the cursor, built with React and canvas.
Press-and-hold confirmation button with an animated progress fill, configurable hold duration, and color variants, built with React and Motion.
A photo grid whose thumbnails grow into a full view and fly back to their slot when you drag them down.
A usage meter filled with liquid that sloshes, ripples and bubbles, built with React and a wave simulation.
A vertical slider you fill like a glass, with a sloshing surface and rising bubbles.
Animated loading indicator with rotating gradient rings, size variants and customizable title text. Built with React and Tailwind CSS.
Magnetic button that pulls floating particles to its center on hover using Motion spring animations, built with React and Tailwind CSS.
A radial menu you hold to open or flick to pick blind, built with React and Motion.
A KPI card whose number rolls to any day you scrub, with periods that reshape the line instead of swapping it.
A card rail you flick with momentum, snapping on a spring, with scroll-driven cover-flow depth and parallax.
A button that grows into the form it opens, with its label sliding up to become the title, then shrinks into a confirmation.
Stacked notifications that fan out on hover and swipe away, built with React and Tailwind CSS.
Music card with a spinning disc you can grab and turn to scrub, built with React and Tailwind CSS.
Button that bursts animated particles from its center on click with a quick scale press effect, built with React, Motion, and Tailwind CSS.
A headline sitting on a string you can pluck, strum and let ring, built with React and real string physics.
A lamp switch you pull on a swinging cord, built with React and a rope simulation.
A receipt that prints line by line, then tears off and falls when you pull it, built with React.
A section rail for long pages, with a tick per heading that you can hover, click or drag to scrub, built with React.
A landing hero where shapes drop in, pile up under the headline and can be grabbed and thrown.