Motion.Production-grade
animation library
for the web.
- Free
- Completely free to use, MIT licensed and open source.
- Production ready
- Trusted by Framer and Figma across hundreds of thousands of sites.
- Hybrid engine
- JavaScript and hardware-accelerated browser APIs in one library.
- Built for AI
- Agent-compatible documentation, skills and API.
- Tiny footprint
- APIs up to 90% smaller than their GSAP alternative.
Animations that move.
Create high-performance web animations with Motion's easy-to-use API, from simple transforms to advanced interactive gestures.
React & JavaScript animation examples.
Start with 480+ copy and paste examples, from scroll effects and gestures to carousels and typewriter animations.
Documentation for React, JavaScript and Vue.
Choose your runtime and start with the API built for your project.
Build faster with Motion+.
AI Kit for your coding agent, Motion UI and 480+ premium examples. All included in Motion+.
Make Cursor a Motion expert.
AI Kit and the Motion MCP give Cursor, Claude and other coding agents the latest docs, 480+ example sources and the full Motion UI catalogue.
Get AI Kit with Motion+Made with Motion.
Everything's possible with Motion. Here are some of the best creations from the Motion community.
Latest from Motion.
New examples, release notes and magazine stories from the Motion team.
Changed
- Removed internal APIs restored in
13.5.1for compatibility withframer-motion13.0–13.4. Future removed internal APIs won't cause cross-compatibility issues since pinning internalframer-motion,motion-domandmotion-utilsdependencies.
- Removed internal APIs restored in
Changed
<motion>: Fall back to the attribute in readSVGValue when computed style is empty.<motion>: Internal changes toanimateChangesfor size reductions.
Fixed
scroll: Temporarily reverted removal of internalobserveTimelineAPI to fix compatibility with previous13.xAPIs. Moving to pinned dependencies before removing in14.x.styleEffect: Cleaning up an earlier value no longer removes a value that was bound to the same key after it.svgEffect: No longer writes transforms and origins as attributes.<motion>:inherit={false}now correctly not inheriting parent animations.<motion>: FixsortNodePositionthrowing when a sibling hasn't mounted
Added
spring: Now accepts negativebounce(0--1) to define overdamped springs.
Changed
<m>: 20% smaller.useSpring: 10% smaller.scroll/useScroll: Use main thread for alloffsetanimations.
Fixed
- Ensure
warninganderrormessages are cleaned from production build. - Ensure values are never rendered before they've been resolved.
Changed
scroll/useScroll: Moreoffsets are now hardware accelerated viaViewTimeline.
Fixed
animate: Reduced size of Motion Studio introspection call.useTransform: Accelerated values now correctly clamp.scroll/useScroll: Ensure offsets work the same across the JS main thread andViewTimeline.scroll/useScroll: RemoveScrollTimeline/ViewTimelineobserver in favour of main-thread scroll tracking.
Fixed
AnimatePresence:mode="wait"no longer drops new children ifexitcompletes during a React transition.

Introducing Motion Studio
A visual and agentic animation editor for your website. Edit Motion animations in a timeline alongside our new Ultramotion agent, and write the result to your code using your existing workflow.

Introducing Motion UI
Production-ready animated sections and components for React. Everything performance-graded with MotionScore, drop-in to your design system via shadcn tokens or AI.
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.
Animation guides and examples.
Go straight to popular techniques, comparisons and production-ready starting points.
Tools for the full animation workflow.
Build faster, check performance and move from an idea to production.









