Components
Inputs & forms.
Form controls follow a simple recipe: 32px height, 1px stroke, 4px radius, brand-green focus ring. Errors get a 12px helper line in danger red.
Text input
Appears as the title in the Suite Header.
This field is required
Checkbox
Switch
Switches are immediate — they commit on toggle, no save button.
Spec
Height32px
Horizontal padding10px
Border1px solid var(--line-strong) — focus var(--accent), error var(--danger)
Radius4px
Label gap4px below the label
Helper / error12px caption directly below