Chapter 47: useSpring

Core Idea

A spring-powered motion value. Standalone or attach to another motion value.

Key Concepts

• Direct control: useSpring can be created with a number
• Track another motion value: Its also possible to automatically spring towards the latest value of another motion value
• Transition: The type of spring can be defined with the usual spring transition option.
• skipInitialAnimation: Default: false
• Animate faster with Motion+.: Unlock 430+ premium examples

Code Examples

import { useSpring } from "motion/react"

• What it demonstrates: Core usage pattern for useSpring.

Key Takeaways

1. useSpring supports Direct control.
2. useSpring supports Track another motion value.
3. useSpring supports Transition.

Connects To

• Motion Values: related Motion doc page.
• React transitions: related Motion doc page.
• useTransform: related Motion doc page.
• Follow pointer with spring example & tutorial for React: related Motion doc page.