Checkbox

A control that allows the user to select one or more items from a set.

Installation

bash
npx shadcn@latest add checkbox

Import

import { Checkbox } from "@/components/ui/checkbox"import { Label } from "@/components/ui/label"

Default

With label

Checked

Disabled

Group

Props

PROPTYPEDEFAULTDESCRIPTION
checkedboolean | "indeterminate"—Controlled checked state
defaultCheckedbooleanfalseInitial state (uncontrolled)
onCheckedChange(checked: boolean | "indeterminate") => void—Called on change
disabledbooleanfalseDisables the checkbox
requiredbooleanfalseMarks as required in a form
namestring—Form field name

Accessibility

  • Space toggles the checkbox
  • Always pair with a Label
  • For a "select all" pattern, use indeterminate state when only some items are selected