UI Components & Animation Library
A comprehensive showcase of UI components and Framer Motion animations
Display Components
Avatar
User representation with image and fallback
Badge
Small status descriptors for UI elements
Card
Container for grouping related content
Create project
Deploy your new project in one-click.
Skeleton
Loading placeholder for content
Feedback Components
Alert
Displays important messages to users
Heads up!
Error
Progress
Shows completion status of a task
Toast
Brief notification messages
Form Components
Button
Trigger actions and events
Input & Label
Text input fields with labels
Checkbox
Binary choice input
Switch
Toggle between two states
Select
Choose from a list of options
Textarea
Multi-line text input
Navigation Components
Dropdown Menu
Menu of actions and options
Tabs
Organize content into sections
Make changes to your account here.
Overlay Components
Dialog
Modal dialog for user interactions
Alert Dialog
Modal dialog for important confirmations
Popover
Floating container for additional content
Layout Components
Accordion
Collapsible content sections
Separator
Visual divider between content
Radix Primitives
An open-source UI component library.
Framer Motion Animations
Fade In/Out Animation
Simple opacity transitions with AnimatePresence
This content fades in and out smoothly
Scale & Rotate Animation
Hover to see scale and rotation effects
Stagger Children Animation
Sequential animations for list items
- First item
- Second item
- Third item
- Fourth item
Drag Animation
Drag the box around with constraints
Layout Animation
Click items to see smooth layout transitions
Path Animation
SVG path drawing animation
Gesture-Based Animation
Different animations based on user gestures
Scroll-Triggered Animation
Animation that triggers when scrolling into view
I animate when you scroll to me!