Browse the complete collection. Select a component to open its documentation.
Updated Components
New Components
Interactive Pets
A playful playground of draggable office pets — a cat, a dog, and a bird — with feeding reactions and idle animations.
Receipt
A polished payment receipt with ticket details, card information, and a decorative barcode.
All Components
Accordion
A vertically stacked set of interactive headings that reveal content.
Alert
A callout for important information with default and destructive variants.
Alert Dialog
A modal dialog that interrupts the user for a confirmation.
Animated Gradient
WebGL-powered animated mist, lava, and plasma backgrounds with smooth silk-like flowing streams.
Badge
A small status label with default, secondary, destructive, and outline variants.
Basic Number Ticker
An animated number ticker component with customizable start, target, transitions, and callbacks.
Breadcrumb
A navigation trail showing the current page's location in the hierarchy.
Button
A button with default, secondary, outline, ghost, destructive, link, and spark variants.
Card
A container with header, title, description, content, and footer sections.
Checkbox
A control that toggles between checked and unchecked.
Dialog
A modal window overlaid on the page with an optional close button.
Dropdown Menu
A menu of actions opened from a trigger element.
Empty
An empty state with media, title, description, and content slots.
Ghost Ether
WebGL-powered interactive fluid simulation with dynamic FBM mist and wandering spirit force trails using three.
Hover Card
A card preview shown when hovering a trigger element.
Image Trail
A framed mouse-tracking image trail with momentum, captions, and customizable styling.
Input
A standard form input styled to match shadcn/ui.
Interactive Pets
A playful playground of draggable office pets — a cat, a dog, and a bird — with feeding reactions and idle animations.
Kanban
A composable drag-and-drop task board styled to match shadcn/ui.
Logo Carousel
A beautiful, high-performance scrolling logo carousel component with pausing, custom directions, speed, and fade effects.
Pagination
A beautiful pagination component with multiple variants, colors, and smooth animations.
Popover
A floating panel anchored to a trigger element.
Progress
A bar indicating the completion progress of a task.
QR Code
A beautiful QR code component with dot styling, gradient support, and extensive color customization.
Receipt
A polished payment receipt with ticket details, card information, and a decorative barcode.
Separator
A horizontal or vertical line separating content.
Sheet
A slide-over panel that extends from any edge of the screen.
Shimmer Text
A premium text component with an elegant shimmer animation effect.
Skeleton
A pulsing placeholder shown while content loads.
Spotify Card
A premium Spotify card with real-time metadata and morphing animations.
Switch
A toggle control that switches between on and off.
Table
A responsive table with header, body, footer, and caption sections.
Tactile Highlight
A fluid text highlight component that reacts to viewport visibility and user interaction.
Textarea
A multi-line text input field.
Toggle
A two-state button that can be toggled on or off.
Tooltip
A short label shown when hovering or focusing an element.