Login / Register

Framer for Developers
Framer for Developers
Code Overrides
Code Overrides Basic Overrides Sharing Data Between Overrides Overriding Smart Components Overriding Code Components Overriding Design Components
Code Components
Code Components A Simple Code Component Why Use <Frame>s? Compatibility with Overrides & Parent Components Including Other Components Customizing an Existing Component Property Controls
Flexbox Component
Animation
Animation The Animate Property The Transition Property ‘While’ Animations and Initial Variants Hooks The useState() Hook Animate Presence The useCycle() Hook The useAnimation() Hook Keyframes Animatable Properties Animation Types Animating to a Scroll Position API Overview Example Animations
Framer Motion
Framer Motion Create React App CodeSandbox Differences With the Framer API Automatic Layout Animations
Shared Layout Animations Layout ID
Scroll-based Animations SVG Animations
Drag Controls Routing
Smart Code Components
Smart Code Components Props Versus State Passing Down Props Sharing State Letting a Prop Change the State Simple But Smart iOS Segmented Control
Dragging
Dragging Axis and Direction Locking Drag Constraints Drag Elastic Drag Momentum Inertia Animations Modify Target Min and Max Snap to Grid Example Snap to Corner Example Drag Events
Archive
Archive Design Components Overrides (pre X22) Code Components (pre X22)
Animations (pre X22)

Framer_basics-States-07-Cycling_through_states-Animation_options

Home FAQ Updates