ATTENTION EFFECT

Bounce.

A brief lift and return creates a lively cue.

See the movement

One intentional trigger

Playback starts only when you request it. Stop returns to the still illustration.

What it does

The surface moves upward and settles back with a smaller second lift. Keep it small and occasional so the bounce attracts attention without interrupting the user’s task.

Timing curveease-out
Default duration800ms
RepetitionOnce per trigger

Make the motion useful

Choose an effect that supports the component’s purpose. Keep the final state clear, preserve focus and reading order, and pair important feedback with a visible message.

CSS animation reference