Motion Keywords

Name the motion. Drop it in. Get the same feel everywhere.

Each card is a distinct, named move — not another fade. Click a card to replay it, then Copy the snippet, or say the keyword while vibe coding (/ss-motion toggle-flip) and the same recipe lands in your code.

Toggle

One control, many ways to switch state.
Off
On
tap
Flip
toggle-flip

3D Y-axis card flip between two faces

Day
tap
Slide stack
toggle-slide

Old value slides out, new slides in from the side

Expanded
tap
Morph
toggle-morph

Shape morphs — pill ⇄ circle, width + radius

Revealed
tap
Curtain
toggle-curtain

Top→bottom clip-path wipe reveals the panel

Reveal

How an element arrives on screen.
Focus
tap
Blur in
reveal-blur

Focus-pulls into place from a soft blur

Headline
tap
Text rise
reveal-rise

Masked clip-path rise — text climbs into view

Panel
tap
Unfold
reveal-unfold

scaleY from the top edge, like an accordion

✓
tap
Pop in
pop-in

Spring overshoot from zero — bouncy arrival

Press

Tactile feedback on tap/click.
tap
Squish
press-squish

Scale-down + tiny skew — jelly press

tap
Ripple
tap-ripple

Material-style radial ripple from the tap point

Attention

Looping or one-shot focus pulls.
♥
tap
Heartbeat
pulse-beat

Looping scale pulse — alive, rhythmic

Wrong code
tap
Wiggle
wiggle

Quick horizontal shake — error / wrong input

tap
Shimmer
shimmer

Skeleton loading sweep across a surface

List

Choreography across many items.
tap
Cascade
stagger-cascade

Children fade-up one after another