Components
Checkbox
A control that allows the user to toggle between checked and not checked.
By clicking this checkbox, you agree to the terms and conditions.
Installation
pnpm dlx shadcn@latest add https://basecn.dev/r/checkbox.jsonExamples
Size
Shape
Color
Cards
Migrating from Radix UI
Common Migration Steps
All components share several migration patterns when moving from Radix UI to Base UI. Before proceeding with component-specific changes, review the essential migration patterns.
Familiarizing yourself with these patterns will make the component-specific migration steps much clearer.
Indeterminate State
In Radix UI, you can pass the checked or defaultChecked prop with a value of "indeterminate" to the Checkbox component to control the indeterminate state.
import { Checkbox } from "@/components/ui/checkbox"
<Checkbox checked="indeterminate" />
// or
<Checkbox defaultChecked="indeterminate" />With Base UI, you can pass the indeterminate prop to the Checkbox component to control the indeterminate state.
import { Checkbox } from "@/components/ui/checkbox"
<Checkbox indeterminate />