Lozenge wave animation - progress

Chronological order. Oldest at top, latest at bottom.

v1 - first attempt

Separate SVG arm + hand overlay

Arm = separate line drawn on top of pill border using stroke-dashoffset. Hand = separate path. Felt disconnected. Not organic.

Click play.
v2 - path morphing

First path-morph attempt

Border deforms as one continuous shape. Wobble too subtle, growth too smooth/uniform. Right direction but needed more character.

Click play.
v3 - T-1000 + travelling wave

Organic growth + wave wobble

Better wobble (travelling wave). T-1000 searching growth. But: corners lost structure, arm tip pointed, hand too rough, return shape imperfect.

Click play.
v4 - latest

Pixel-perfect pill + rounded arm + proper hand

Kappa-correct arcs for perfect pill. Rounded arm tip (no point). Proper hand with visible finger silhouette. Guaranteed return to exact starting shape.

Key frames

Animated preview

Auto-plays on load.