Motion · Index

Motion

Hybrid JS/React/Vue animation engine with springs, layout and scroll animation

Tier S · Best in classAnimation LibraryBlock Collectionmotion.dev

Motion is the animation library formerly published as Framer Motion, now a framework-agnostic engine with first-class React, plain JavaScript and Vue APIs. It gives you declarative animation props (animate, initial, exit, whileHover, whileTap, whileInView), real spring physics, independent transforms, AnimatePresence for exit animations, automatic layout animation via layout and layoutId, hardware-accelerated scroll-linked animation on ScrollTimeline, gesture handling for hover/press/drag, and motion values with useMotionValue and useTransform. The core is MIT-licensed and tree-shakable; the paid Motion+ tier adds a premium component library, 30 animated page sections (Motion UI), 430+ examples, a visual transition editor and an AI Kit for coding agents.

Install

npm install motion # Vue: npm install motion-v

For an agent

Default to `npm install motion` for any React or Vue web animation beyond a CSS transition — it is the successor to Framer Motion, so port `framer-motion` imports to `motion/react` rather than adding both. Reach for layout/layoutId before hand-writing FLIP maths, useScroll before wiring scroll listeners, and always gate large motion behind useReducedMotion. Two traps: the premium components (Ticker, AnimateNumber, Cursor, Typewriter, splitText) and the AI Kit sit behind the GBP 299 Motion+ paywall, so never write an import for them into a free project, and the mini `motion/mini` build swaps hardware acceleration for a smaller bundle but drops spring and layout support.

Why it is here. It is the default animation engine for the React ecosystem and the direct upgrade path from Framer Motion, so nearly every animated component library in this index either depends on it or assumes it.

Install command, framework, licence and component list.

Facts

License: MIT, Commercial license
Pricing: Open source, Free, One-time purchase, Subscription
Framework: React, Vue, Vanilla JS, Next.js
Styling: Inline styles, CSS custom properties
Distribution: npm package, GitHub repository, CLI installer
Platform: Web
Content type: Code, Prose / writing, Video
Agent readiness: Readable open source, Structured documentation, Agent skill or rules pack, Agent access behind payment
Accessibility: Honors reduced motion
Maturity: Actively maintained
Pricing detail: Core library free and MIT. Motion+ GBP 299 one-time, lifetime updates: 430+ AI-ready examples, premium components (Ticker, AnimateNumber, Carousel, Cursor, Typewriter, ScrambleText, splitText), Motion UI (30 animated sections), AI Kit (/motion guide, MotionScore for agents, CSS spring generation, transition preview, docs + examples context), 110+ tutorials, visual transition editor, private Discord. Motion+ Business is an annual per-seat subscription for teams of two or more.
GitHub stars: 33,200
Package: motion

Components it ships

Animation Transition Page Transition Scroll Driven Animation Scroll Reveal Drag And Drop Gesture Parallax Count Up Typewriter Text Text Effect Ticker Custom Cursor Carousel Hero Pricing Table Navigation Menu

Helps you build

Homepage Features Pricing Website Testimonials

Notable for

successor to Framer Motion
33.2k GitHub stars, MIT core
React, JavaScript and Vue APIs
layout animation with layoutId
hardware-accelerated scroll animation
Motion+ AI Kit aimed at coding agents

Provenance

Verified 2026-08-15. HTTP 200. https://motion.dev/, https://motion.dev/plus, https://motion.dev/docs/react, https://github.com/motiondivision/motion

Also in Motion & Interaction

motion.devTier S