Motion
Staggered Animation
motionanimationsequencelistentrance
A group of elements animate sequentially with a small delay between each, creating a flowing entrance.
When to use
- List or grid of items entering the viewport
- Feature sections where each point should land individually
- Keep delay intervals small (40–80ms) — large gaps feel slow
Examples
- Team member cards animating in left-to-right on scroll
- Pricing tier cards staggering in with 80ms between each
See this in the wild
Analyze a site and look for staggered animation in the breakdown.
