Motion logo

Motion for React

Motion for React is an open source, production-ready library that’s designed for all creative developers. It's the only animation library with a hybrid engine, combining the power of JavaScript animations with the performance of native browser APIs. It looks like this: ```jsx ``` It does all this: - [Springs](https://motion.dev/docs/react-transitions#spring) - [Keyframes](https://motion.dev/docs/react-animation#keyframes) - [Layout animations](https://motion.dev/docs/react-layout-animations) - [Shared layout animations](https://motion.dev/docs/react-layout-animations#shared-layout-animations) - [Gestures (drag/tap/hover)](https://motion.dev/docs/react-gestures) - [Scroll animations](https://motion.dev/docs/react-scroll-animations) - [SVG paths](https://motion.dev/docs/react-animation#svg-line-drawing) - [Exit animations](https://motion.dev/docs/react-animation#exit-animations) - [Server-side rendering](https://motion.dev/docs/react-motion-component#server-side-rendering) - [Independent transforms](https://motion.dev/docs/react-motion-component#style) - [Orchestrate animations across components](https://motion.dev/docs/react-animation#orchestration) - [CSS variables](https://motion.dev/docs/react-animation#css-variables) ...and a whole lot more. ## Get started ### 🐇 Quick start Install `motion` via your package manager: ``` npm install motion ``` Then import the `motion` component: ```jsx import { motion } from "motion/react" export function Component({ isVisible }) { return } ``` ### 💎 Contribute - Want to contribute to Motion? Our [contributing guide](https://github.com/framer/motion/blob/master/CONTRIBUTING.md) has you covered. ### 👩🏻‍⚖️ License - Motion for React is MIT licensed. ## ✨ Sponsors Motion is sustainable thanks to the kind support of its sponsors. ### Partners #### Framer Motion powers Framer animations, the web builder for creative pros. Design and ship your dream site. Zero code, maximum speed.

### Platinum

### Gold

### Silver

### Personal - [Nusu](https://x.com/nusualabuga) - [OlegWock](https://sinja.io) - [Lambert Weller](https://github.com/l-mbert) - [Jake LeBoeuf](https://jklb.wf) - [Han Lee](https://github.com/hahnlee)