Component 07 · Complete

Checkbox and Radio

Checkbox supports independent selections. Radio chooses exactly one option from a visible, mutually exclusive group.

Checkbox

Choose any number of options

Each option remains independently selectable and uses a visible native label.

Email preferences

Indeterminate

Reflect a partially selected group

The parent updates from its child checkboxes and can select or clear the entire group.

Project access

Radio

Choose exactly one option

A native fieldset and legend name the group. Arrow-key behavior stays native.

Team size

Choice cards

Add description without changing semantics

The complete card remains the label and selection still uses native Radio behavior.

Workspace visibility

States

Unavailable and invalid choices remain explicit

Native disabled prevents interaction. Invalid groups connect a specific recovery message.

Confirmation

Confirm the project details to continue.

Usage guidance

Make the selection model obvious.

Use Checkbox for independent choices and Radio when one visible option must replace another.

Next component: Switch