Checkbox

Forms

A binary control that allows users to toggle between checked and unchecked states for selections.

Loading component...

Run the following command to add this component to your project:

$pnpm dlx static-ui add checkbox

Import the component directly from the package:

import { Checkbox } from "@static-ui/ui"

Common props available for this component:

Prop	Type	Description
checked	boolean	Controlled checked state.
onCheckedChange	(checked: boolean) => void	Callback when checked state changes.
disabled	boolean	When true, prevents interaction.
className	string	Additional CSS classes to apply.

Supports indeterminate state via `aria-checked="mixed"`. Uses native `<input type="checkbox">` for built-in accessibility.

CalendarDate selection month grid.

InputText field for user entry.

Input GroupGrouped input with adornments.

Input OTPOne-time passcode entry.

LabelForm control label.

Number FieldNumeric input with steppers.

Radio GroupMutually exclusive options.

SelectDropdown value picker.

SliderDrag handle range input.

SwitchToggle on/off control.

TextareaMulti-line text input.