Skip to main content

Options

The Checkbox supports selection, an indeterminate mixed state, and either a visible label or an indicator-only presentation.

Selection

The checkbox toggles between unselected and selected. Use isSelected for controlled selection or defaultSelected for uncontrolled.

Indeterminate

isIndeterminate renders a minus indicator for a select-all row whose children are only partially selected. It’s a display-only override — pair it with your own logic to derive the mixed state from the children’s selection, as shown above.

Label

A visible label doubles as the accessible name. Omit label and supply aria-label or aria-labelledby instead for an indicator-only checkbox — common in dense table rows.

Behavior

The Checkbox responds to selection, focus, and disabled states.

Visual States

Selecting the checkbox fills the indicator; keyboard focus draws a ring scoped to the square indicator, not the full label width. isDisabled dims the control and blocks interaction in either selection state.

Keyboard Interaction

Users can navigate and toggle the Checkbox using standard keyboard controls.
Last modified on July 24, 2026