Zippex Design
Pillar · the kit

Components

Buttons, inputs, badges, sheets, toasts, skeletons. Each in its real states, with the motion built in.

Buttons

Primary, ghost, loading, danger, disabled, every one with scale(0.97) press feedback.

Refresh button

Squishes to a spinning circle, then springs back to a green confirmation.

Inputs

A teal focus ring is the only color, calm until you interact.

Status badges

A dot plus colored text, no filled pills. Semantic roles do the signalling.

DeliveredIn transitPendingFailed

Skeleton

Loading placeholder that sweeps, then cross-fades into content.

Toast

Stacking confirmation, enters and exits from the same edge.

Bottom sheet

The drawer curve with drag-to-dismiss.