Free and
open-source
Easy to use
Production-ready
Hybrid engine
Robot friendly
Tiny footprint
Features
Animations that move
Create high-performance web animations with Motion’s easy-to-use API — from simple transforms to advanced interactive gestures.
Simple API
Motion’s pick-up-and-play API is easy to start and fun to master.
Independent transforms
Animate
x,y,rotateZetc independently, without wrapper elements.Scroll animation
Smooth, hardware-accelerated scroll animations.
Spring physics
Real spring physics for great-feeling animations.
Exit animation
AnimatePresencemakes it easy to animate elements as they exit.
Gestures
Hover, press and drag gestures that feel native, not “webby”.
Layout animation
Animate between different layouts with Motion’s industry-leading layout animation engine.
Timeline sequences
Variants, stagger and timelines make it easy to precisely orchestrate animations.
Examples & Tutorials
Learn by doing
Examples and tutorials for React animation, JS gestures and Vue transitions, with copy/paste source code and step-by-step guides.
Sponsors
Trusted by the world's leading teams
Motion is deployed and sponsored by the best teams in the industry, powering UI animations across millions of sites.
Adoption
Selected by the community
Motion is the fastest-growing animation library in the world, with over 10 million monthly downloads on npm.
10 million
Motion
React Spring
GSAP
Anime.js
What's new
Updates
Always in Motion. Follow the latest releases, content, and examples. All in one feed.
Example:
Cursor: Floating Target
Aug 21, 2025
Example:
Card Stack
Aug 20, 2025
Example:
Material Design Ripple
Aug 16, 2025
Level up your animations with Motion+
More than 180+ exclusive examples, creative APIs like Cursor, private Discord and GitHub, and powerful VS Code animation editing tools.
One-time payment, lifetime updates.
Delight the web with Motion
Top 5
Most popular
Jump straight into the most popular pages across the site.
