CleenUI · Forms · Checkbox

Checkbox

Single boolean checkbox with label, indeterminate state, and form integration.

storybook.cleenui.com · forms-checkbox--error
Open in new window

About Checkbox

Checkbox is the atomic on/off control. It supports a third indeterminate state (the dash glyph) for parent checkboxes whose children are mixed — useful in tree-like selection UIs and bulk-action tables.

The label slot accepts any JSX, so you can compose explanations, links, or icons alongside the control. Keyboard focus, space-to-toggle, and ARIA semantics are wired correctly.

When to use it

  • Single boolean preferences in settings.
  • Per-row selection in tables (with indeterminate parent).
  • Terms-of-service acceptance with inline links.
  • Filter inclusions in faceted search panels.

Common props

Prop
Type
Description
checked
boolean
Controlled checked state.
indeterminate
boolean
Render the indeterminate (dash) glyph.
label
ReactNode
Label content; can include JSX.
onChange
(checked: boolean) => void
Change handler.
disabled
boolean
Disable interaction.
Cross-references

Where this component shows up elsewhere in the foundation.

In modules

2
⚡ Already in an AI editor?

Set up CleenUI in your tool.

Skip the manual import — ask your AI agent to build with this component. The Builder skill knows its props, variants, and idioms.

Claude CodeCursorWindsurfGitHub CopilotClineAider+6All 12 guides
Other categories

More component families.