Checkbox
Select zero or more options, or toggle a single setting that only takes effect when the form is saved. If the change applies immediately, use a Switch instead.
Added in v1.0.0 · import from "@borneo/react"
Interactive previewPermalink to this section
The indeterminate state is a third value, not a visual trick — it is reported to assistive technology as “mixed”.
About once a month. Unsubscribe any time.
State
Size
Enabled
checkbox-preview.tsx
<CheckboxField
id="product-updates"
label="Email me about product updates"
description="About once a month. Unsubscribe any time."
size="md"
/>AnatomyPermalink to this section
About once a month. Unsubscribe any time.
StatesPermalink to this section
Unchecked
Checked
Mixed
Focus visible
Disabled
Disabled checked
Small
Medium
Select allPermalink to this section
A parent checkbox reflects its children: all, none, or mixed. Toggle the children to watch the parent change.
1 of 3 selected