Documentation

Documentation

React

Framer

Framer

Framer is the world's best no-code website builder. If you have a Framer website, all your animations are already powered by Motion.

Framer offers a number of animations, interactions and components that mean you usually never need to write any code to achieve amazing effects.

However, advanced users can write code components and overrides, which are custom React components that you can drop into your canvas.

The full Motion for React API is available to use in both.

Import

Import Motion for React via "framer-motion":

import { motion, useSpring } from "framer-motion"

Use "framer-motion" whenever the Motion docs instruct you to use "motion/react".

Next

With Motion set up in your Framer project, we recommend you follow the rest of the Quick Start guide to begin learning Motion for React.

A Motion+ membership will give you early access to features & content, access to our private Github and Discord, and more.

It's a one-time fee that grants lifetime access. No subscription necessary!

MOTION+

Introducing Cursor

Cursor is a creative cursor component for React, that makes it super easy to make custom cursor and follow cursor effects.


Hover over these examples to check out some of what it can do:

Custom cursor

Follow with spring

Multicursor

?

?