Animation Dictionary v1.0

Motion
Index

Shapes move in color. Text stays white or black.

palette
#FF8400
#FF4400
#FF0066
#CC00AA
#8800FF
#0066FF
#2233CC
text → #ffffff or #000000 only
01
fade
opacity 1 → 0 → 1
ease-in-out · 2s
02
slide-x
translateX -44 → 44
ease-in-out · 2s
03
slide-y
translateY -32 → 32
ease-in-out · 2s
04
pulse
scale 1 → 2 → 1
ease-in-out · 1.5s
05
spin
rotate 0 → 360°
linear · 2s
06
blink
opacity hard cut
step-end · 1s
07
bounce
translateY 0 → -30 → 0
ease-in-out · 1s
08
grow
scaleX 0.08 → 1 → 0.08
ease-in-out · 2s
09
shake
translateX ±9px stagger
ease-in-out · 1s
10
orbit
rotate + translateX 30px
linear · 2s
11
blackroad
cursor
text white · cursor white
step-end · 0.8s
12
wave
scaleY staggered bars
ease-in-out · 1s
13
flip
rotateY 0 → 360°
ease-in-out · 2s
14
color-cycle
orange → pink → purple → blue
linear · 3s
15
grad-shift
gradient background sweep
ease · 3s
16
BlackRoad BlackRoad BlackRoad
text rule
white on black · black on white
grad on black (accent only)
17
border-pulse
border-color cycles palette
ease-in-out · 2s