Transitions & Animations
Page transitions, list animations, and dynamic effects
Page Fade Transition
Smooth crossfade between pages
When to useUse for multi-step flows, wizards, or content switching.
Welcome
First page
Staggered List
Items appear one by one
When to usePerfect for task lists, feeds, or any sequential content.
📧 Check emails
📝 Review docs
📞 Call client
🎯 Update status
☕ Take break
Counter / Odometer
Animated counting
When to useGreat for stats, dashboards, or achievement displays.
597
Target: 1,000
Loading Spinners
Various loading indicators
When to useUse during async operations to show progress.
Pulse / Heartbeat
Rhythmic pulsing
❤️
Expand / Collapse
Accordion transitions
Flip Card
3D card flip
Typewriter
Letter by letter
Welcome
Progress Bar
Animated progress
When to useIdeal for uploads, downloads, or multi-step processes.
0%
Slide Transitions
Directional slides
Scale Transition
Zoom in/out
✨
Rotate Transition
Spin animation
🔄
Morph Transition
Shape morphing
square
Blur Transition
Focus/blur effect
Content
Skeleton → Content
Loading placeholder
Parallax Layers
Multi-depth scrolling
🚀
Move mouse to see parallax
Number Flip
Digit flip animation
0
0
0
