Checkbox

Checkboxes let people select one or more items from a list, or turn an item on or off.

Props

React props
NameTypeRequiredDefaultDescription
classNamestring | Partial<Record<"box" | "input" | "icon" | "stateLayer" | "checkbox", string>> | ClassNameComponent<CheckboxInterface>No—Root classes (string), static element classes (object), or state-aware element classes (function).
checkedbooleanNo—Controlled mode: explicitly control whether the checkbox is checked.
disabledbooleanNofalsePrevents interaction and form changes.
namestringNo—Name of the underlying form control.
requiredbooleanNofalseRequires the checkbox to be selected before its form can submit.
valuestringNo—Value submitted with the form when checked.
defaultCheckedbooleanNofalseUncontrolled mode: initial checked state.
idstringNo—Id of the underlying form control. Auto-generated if not provided.
styleCSSPropertiesNo—Styles applied to the Checkbox touch target.
indeterminatebooleanNofalseMarks the checkbox as partially selected without changing its checked value.
invalidbooleanNofalseExposes the native invalid state and uses the error color role.
onCheckedChange(checked: boolean) => voidNo—Called once for each accepted checked-state transition.