We are live on DevHunt: tool of the week contest

check it out

Atomic Components

Essential UI building blocks engineered for high performance and maximum customizability. Just copy, paste, and make it yours.

Blur Fade

Fades and un-blurs text or components on scroll.

Border Beam

An animated light beam running along the border of an element.

Button

A premium button component with inner border effects.

Checkbox

A high-fidelity checkbox with multiple animation variants and sizes.

framer-motion

Copy Input

A text input with an integrated copy button and feedback.

Dialog

A premium modal dialog with high-fidelity animations and depth styling.

react-dialogclsx+1 more

Dropdown Menu

A premium animated dropdown menu with spring physics and glassmorphism.

framer-motionreact

Expandable Dock

A macOS-inspired dock with magnification effect and glassmorphism.

framer-motionreact

Flip Words

3D spinning text that flips through words.

Glass Card

A premium frosted glass card with light reflections.

Glitch Text

Text component with a high-fidelity RGB glitch animation.

framer-motion

Gooey Button

A button with a liquid gooey effect using SVG filters.

Input

A premium input field with inner depth shadows and focus animations.

Interactive Stack

A pile of cards that fan out on hover with spring physics.

framer-motion

Letter Pull Button

A button where letters pull apart on hover.

framer-motion

Loader

Collection of loading spinners and animated indicators built with TailwindCSS.

Magnetic Button

A button that attracts the cursor with a smooth spring effect.

framer-motion

Magnetic Text

Text that subtly pulls toward the mouse cursor.

framer-motion

Neon Button

A button with a tracing neon light border effect.

framer-motion

Noise Card

A card with a fractal noise grain overlay.

Number Ticker

An animated number counter for statistics and achievements.

framer-motion

Progress Ring

Animated SVG circular progress indicator with gradient and glow variants.

Radial Gauge

A sophisticated circular progress gauge with glow effects and data visualization.

framer-motion

Scan Button

A tech-style button with a scanning laser animation.

framer-motion

Shimmer Button

A button with a moving shimmer light ray effect.

framer-motion

Skeleton

A placeholder component with a shimmer animation for loading states.

Spotlight Card

A card component with an interactive spotlight following the mouse.

framer-motion

Status Badge

A badge with a pulsing dot to indicate live or system status.

Switch

A premium toggle switch with spring physics and tactile feedback animations.

framer-motion

Tabs

Highly animated navigation tabs with multiple visual variants.

Text Scramble

Hacker-style text deciphering animation on hover or mount.

Theme Toggle

An animated light/dark mode switch using View Transitions API.

lucide-reactnext-themes

Tilt Card

An interactive 3D card that tilts on mouse hover.

framer-motion

Tooltip

Premium animated tooltip with multiple placement and variant options.

Typewriter

Animated typewriter effect that cycles through a list of words with a blinking cursor.

Warp Button

A button with a spatial warp/ripple effect on click.

framer-motion