Checkbox

Checkboxes allow users to select one or more options from a set. They are ideal for turning an option on or off.

Props

PropTypeDescription
labelstringThe text label displayed next to the checkbox.
...propsInputHTMLAttributesStandard input attributes like `disabled`, `checked`, `onChange`, etc.

Examples

Basic Checkbox

A standard checkbox with a label. The entire area is clickable.

<Checkbox label="Subscribe to newsletter" />

Checked by Default

Use the `defaultChecked` prop for uncontrolled components or `checked` for controlled components.

<Checkbox label="Receive special offers" defaultChecked />

Disabled States

A checkbox can be disabled to prevent user interaction in both checked and unchecked states.

<>
  <Checkbox label="Cannot check" disabled />
  <Checkbox label="Already checked" disabled defaultChecked />
</>