Complete documentation of the Motion animation library and Framer’s code features.
Getting started with Motion
Learn more about Motion’s features and get started by exploring a few interactive examples.
An open source production-ready motion library for React.
Get started with Motion and learn by exploring interactive examples.
Simple examples for animation, gestures, components, transforms and more.
How to animate in Framer Motion.
A Transition defines how values animate from one state to another.
A powerful gesture recognition system for the browser.
MotionValues track the state and velocity of animating values.
Utilities provide simple helper methods and properties for advanced interactive needs.
Motion components are DOM primitives optimised for 60fps animation and gestures.
Animate layout changes across, and between, multiple components.
Animate components when they're removed from the React tree.
Reduce bundle size by lazy-loading a subset of Motion's features.
Set configuration options for Framer Motion.
How to design accessible animations with Framer Motion.
Handoff from Framer
How to convert interactive Framer prototypes into production.
Reduce bundle size
Learn what makes up Motion's bundle size, and how to reduce it.
How to upgrade to the latest version of Framer Motion
Migrate from Pose to Motion
How to convert a Pose project to Framer Motion.
Extend your prototypes with code using Code Components and Overrides.