1. Docs
  3. Components
  5. Checkbox

Checkbox

A control that allows the user to toggle between checked and not checked.

Docs

Component checkbox-demo not found in registry.

Installation

npx shadcn@latest add @kanpeki/checkbox

Usage

Single import

import { Checkbox } from "~/components/ui/checkbox";
<Checkbox.Provider>
  <Checkbox.Root>
    <Checkbox.Indicator />
  </Checkbox.Root>
</Checkbox.Provider>

Multiple imports

import {
  CheckboxProvider,
  CheckboxRoot,
  CheckboxIndicator,
} from "~/components/ui/checkbox";
<CheckboxProvider>
  <CheckboxRoot>
    <CheckboxIndicator />
  </CheckboxRoot>
</CheckboxProvider>

Examples

Default

Component checkbox-demo not found in registry.

Disabled

Component checkbox-disabled not found in registry.

Form

Component checkbox-form not found in registry.

CardCollapsible