Checkbox
stableclientradix checkbox
An independent on/off choice, applied when the form is submitted. For something that takes effect immediately, use Switch.
States
Adds about 400 rows.
<Checkbox label="Show stale pins" defaultChecked />
<Checkbox label="Include archived berths" hint="Adds about 400 rows." />
<Checkbox label="Indeterminate" checked="indeterminate" />Props
| Prop | Type | Default | Description |
|---|---|---|---|
| label* | ReactNode | — | Visible label. |
| checked | boolean | "indeterminate" | — | Controlled state. Indeterminate is for a partially-selected parent. |
| onCheckedChange | (checked: boolean | "indeterminate") => void | — | Fires on change. |
Guidance
Do
- Phrase the label positively — 'Show archived', not 'Hide archived'.
Don't
- Don't use a checkbox for a setting that applies instantly; that's a Switch.
Accessibility
Radix renders a hidden native input, so it participates in form submission normally.
Space toggles. The label is clickable.