Checkbox

A control that allows the user to toggle between checked and unchecked states. Built on Radix UI Checkbox.

With Label

Accept Terms and Conditions

By checking this, you agree to our Terms of Service.

Pass defaultChecked to start in the checked state (uncontrolled).

Checked by default

Pass disabled to prevent interaction.

Disabled checkbox

Combine multiple checkboxes for picking several options.

Option 1

Option 2

Option 3

The indeterminatestate is useful for “select all” parent checkboxes when only some children are checked:

Select all

Prop	Type	Default	Description
`checked`	`boolean \| 'indeterminate'`	—	Controlled checked state.
`onCheckedChange`	`(checked: boolean \| 'indeterminate') => void`	—	Callback when checked state changes.
`defaultChecked`	`boolean`	`false`	Uncontrolled default checked state.
`disabled`	`boolean`	`false`	Prevents interaction.
`required`	`boolean`	—	Marks the checkbox as required in a form.
`name`	`string`	—	Name for form submission.