Design System

Components / Buttons

A button is a button.

One size. Four variants — Primary, Secondary, Ghost, Danger. No spinners inside buttons (disable and replace label instead). No transform on hover (the signal is shadow, never motion). Crisp systems don't shove buttons around under the cursor.

Primary

One per screen, maximum13/1.0/-0.01em · 7×14 padding · 6px radius

The green one. Reserved for the single most-important action on a screen. Two primary buttons on the same surface is always wrong.

Secondary — the workhorse

Default for non-primary actionsShadow-bordered, surface bg

Ghost — lowest weight

Cancel · dismiss · low-weight navTransparent · text in fg-secondary

Danger — outlined, never filled

Outlined danger — filled is for confirm-dialogs onlyRed ring, surface bg, danger fg

No transform on hover. The hover signal is shadow or background intensity — never motion. Crisp systems don't shove buttons around under the cursor.