Checkbox

A checked, unchecked, or indeterminate control for selection and acknowledgment.

Use Checkbox when people can select zero or more options or affirm a statement. Use Switch for a setting that takes effect immediately.

Send weekly digestNotify on new commentsNotify on mentions

Checkbox group

Installation

$npx shadcn@latest add @patchui/checkbox

The copied source is available in the registry JSON. The canonical implementation lives in packages/react/src/components/checkbox.tsx.

<Checkbox>Send weekly digest</Checkbox>

Passing children creates a clickable label. Bare checkboxes require an accessible name.

Indeterminate communicates partial collection selection. Application state still determines what happens on the next change.

UncheckedCheckedPartially selectedDisabled

Selection states

Checkbox accepts the underlying Base UI checkbox props. These fields coordinate Patch UI behavior.

Prop	Type	Default	Description
children	ReactNode	-	Adds a visible label and expands the click target.
checked / onCheckedChange	boolean / (checked: boolean, details) => void	-	Controls checked state.
defaultChecked	boolean	false	Sets the initial uncontrolled state.
indeterminate	boolean	false	Displays partial selection while application state remains authoritative.
wrapperClassName	string	-	Styles the generated label wrapper when children are present.

Give every bare Checkbox a specific aria-label, such as Select Ada Lovelace.
Group related checkboxes with fieldset and legend.
Clear indeterminate state when the controlled collection becomes fully selected or unselected.