Hold to confirm

A Motion for React example showing long-press interaction. The button's events update a progress motion value that drives multiple animations of other motion values.

BKMN

Related docs

Motion component

Animate elements with a declarative API. Supports variants, gestures, and layout animations.

Motion values overview

Composable animatable values that can updated styles without re-renders.

useTransform

Transform the output of one motion value into a new motion value.

React animation

Create React animation with Motion components. Learn variants, gestures, and keyframes.

Motion component

Animate elements with a declarative API. Supports variants, gestures, and layout animations.

Motion values overview

Composable animatable values that can updated styles without re-renders.

useTransform

Transform the output of one motion value into a new motion value.

React animation

Create React animation with Motion components. Learn variants, gestures, and keyframes.

Motion Studio

Enhance your AI code editor with this example

Use Motion Studio to create new components or infuse static designs with animations based on "Hold to confirm" and 300+ other examples.

Discover Motion Studio

Hold to confirm

Related docs

Motion component

Motion values overview

useTransform

React animation

Motion component

Motion values overview

useTransform

React animation

Enhance your AI code editor with this example

Stay in the loop

Stay in the loop