Checkbox

Selection controls for single values and multi-select lists. Supports checked, indeterminate, and disabled states across three shape variants and two sizes.

Sizes

Two sizes — sm (16 px) and md (20 px, default).

Variants

Three shape variants — square (default), rounded, and circle (radio-style dot).

States

Unchecked, checked, indeterminate, and disabled — across both sizes.

Unchecked

Checked

Indeterminate

Disabled unchecked

Disabled checked

Disabled indeterminate

With label

Pass a label prop to render a clickable label beside the checkbox.

With label and description

Add a description for supporting text below the label.

Save my login details for next time.
Save my login details for next time.