ScrollX UI is an open-source React and shadcn-compatible component library for animated, interactive, and customizable user interfaces. It offers motion-driven components that blend seamlessly with modern ShadCN setups.
A collapsible component for showing and hiding content sections.
A modal dialog used to convey critical information and require a user response before proceeding..
AnimatedButton is a highly customizable animated button component with shimmer effects, glow, and visual styling options.
A headless and styled tab UI component set for switching content views.
Minimal testimonials with image and quote for clean, modern design.
Generates animated text word-by-word with blur, highlights, links, and smooth effects.
An announcement component that highlights key info with icons, effects, and expandable content.
A responsive container component that maintains a fixed aspect ratio, commonly used for media like images and videos.
A captivating background effect featuring softly glowing, animated dots that mimic the ethereal beauty of the aurora borealis.
Customizable Avatar component with animated borders for status indicators like "close friends" or "normal story".
Overlapping avatar circles that expand smoothly to reveal each user's name on hover.
animated background featuring vertical meteor-like beams falling from the top to the bottom of the screen over a grid pattern.
A set of SVG paths that animate as if being drawn. Great for tech hero backgrounds.
A small badge component with customizable variants and shiny animation effects.
Vertical wave bars animate in symmetry, forming a subtle motion-driven background layer.
Multiple background beams travel upstream, forming a hero section background.
A responsive grid layout for showcasing features in varied card sizes with optional tilt effects.
Modern Bento Grid with blur and smooth reveal animations.
lightning bolts burst randomly with sparks and particles, creating a high-energy, reactive background effect.
Modern UI cards with a moving border and smooth transitions.
Reusable button component with multiple variants and sizes.
A date field component that enables users to choose and edit a date.
Renders a card component comprising a header, content section, and footer...
Renders a card component with flip animation, supporting front/back content.
smooth card tilt that responds naturally to your cursor, giving the card a more polished, modern look.
A carousel component with card stack visualization for cycling through content.
A customizable checkbox component with animated checkmark and indeterminate states.
Animated checklist illustration with sliding tasks and progressive completion.
clock component with rotating hands and glowing effects, perfect for CTA sections.
Syntax-highlighted codeblock component built on top of react-syntax-highlighter.
An interactive component which expands/collapses a panel with a smooth motion.
column grid background with radial fade and subtle noise. Great for hero backgrounds.
Modern Contact with globe and smooth reveal animations.
Minimal contact section with animated pixel background and stagger button.
A modern cosmic background featuring smooth motion and immersive depth effects.
Modern CTA with avatars and smooth reveal animations.
CTA section with dashed border effects.
CTA section with staggered image gallery.
Text is revealed on scroll with pointer, gradient, and border effects.
The CursorImageTrail component creates an interactive mouse trail effect with animated images.
decorative text frame with corner accents and a compact entrance effect.
Dot-based waves ripple outward in symmetry, creating a subtle, motion-driven background layer
A download section with subtle column lines.
A download section with an iPhone mockup.
It displays a circular, draggable avatar with customizable size and style.
An interactive card with a drift hover effect that visually highlights content.
Animated Dropdown Menu Reveals a menu of options or actions when activated by a button.
Corner-based spark waves that radiate inward and outward with smooth motion.