Foundations

Elevation & Motion

Shadow depth for layering surfaces, and the small set of motion patterns the product uses — quick and purposeful, never bouncy.

Shadow scale

Six depths, from a barely-there edge to a full modal shadow.

shadow-xs

shadow-sm

shadow-md

shadow-lg

shadow-xl

shadow-modal

Each demo plays once on click — reduced-motion preferences are respected automatically at the CSS level.

Fade in + up

Request completed in 62ms

Scale in

New API key created

Shimmer / skeleton

Drawer slide

Click Replay to slide the drawer in from the right.