Motion.
Production-grade animation for the web.
Available for React JavaScript Vue
- 01 / Free
- Completely free to use, MIT licensed and open source.
- 02 / Production ready
- Trusted by Framer and Figma across hundreds of thousands of sites.
- 03 / Hybrid engine
- JavaScript and hardware-accelerated browser APIs in one library.
- 04 / Built for AI
- Agent-compatible documentation, skills and API.
- 05 / 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.
Copy, paste, ship.
Build previously complex effects, like magnetic cursors or infinite scrolling tickers, with 410+ copy and paste examples. Or adapt to your codebase using AI.
Give every project a head start.
Equip your agent with specialist Motion context, then build from production-ready animated sections that inherit your design system.
Give your agent specialist Motion judgement.
Send the latest docs, 410+ example sources, performance audits and production-ready CSS springs directly to your agent.
Explore AI KitBegin with production-ready motion.
Browse performance-rated animated sections, install the source and inherit the design tokens your project already uses.
Browse Motion UI
Made with Motion.
Everything's possible with Motion. Here are some of the best creations from the Motion community.
Latest from Motion.
Release notes and magazine stories from the Motion team.
Changed
- Removed optional
@emotion/is-prop-validdependency in favour of explicit<MotionConfig isValidProp={isPropValid}>.
Fixed
- Hardware-accelerated SVG elements correctly apply final style on animation complete.
AnimatePresence: Ensure nodes are marked as safe to remove when renderingpropagatewith nomotionchildren.
- Removed optional
Added
- Hardware acceleration for
backgroundColorin supported browsers. - Hardware acceleration for SVG elements.
Fixed
AnimatePresence: Exiting children no longer interleave with entering children, which could reorder and remount children present in both renders.motion: Throw error when passing a custommotioncomponent an incorrectreftype.
- Hardware acceleration for
Added
- MCP:
search-motion-codexnow returns Motion UI components and sections (Motion+ / React) as full multi-file paste-ready source — same delivery model as examples, baked into the package.
- MCP:
Added
- Motion UI launches with 26 sections and 35 components.
- Read the announcement.
Fixed
animateView: Cropped group layers now animateborder-radiusfrom the old to new radius.
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.
A View Transition API for the rest of us
The View Transition API can animate the impossible, but using it can be painful. Here's how Motion's animateView(), now free in the core library, fixes its rough edges.
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.
Choose your runtime
Start with the API built for your project.