Checkbox
A controlled and uncontrolled checkbox with support for sizes and disabled state.
Default
An uncontrolled checkbox with no initial value.
<Checkbox />Checked
Use defaultChecked to set the initial checked state in uncontrolled mode.
<Checkbox defaultChecked />Sizes
Use the size prop to control the checkbox dimensions. The default size is md.
<Checkbox size="sm" />
<Checkbox size="md" />Disabled
Pass the disabled prop to prevent interaction.
<Checkbox disabled />
<Checkbox defaultChecked disabled />Props
| Prop | Type | Default | Description |
|---|---|---|---|
checked | boolean | — | Controlled checked state |
defaultChecked | boolean | false | Initial uncontrolled state |
onCheckedChange | (checked: boolean) => void | — | Called when value changes |
size | 'sm' | 'md' | 'md' | Controls dimensions |
disabled | boolean | false | Prevents interaction |
className | string | '' | Additional Tailwind classes |