Checkbox · Radio · Switch

Three controls, one rule for choosing between them. Checkbox and Radio stage a choice you will submit. A Switch commits immediately — if it needs a Save button next to it, it should have been a checkbox.

Checkbox

Email me on failureWith hintSent within a minute of the run ending.DisabledDisabled + checked

Indeterminate

There is no HTML attribute for this state — it can only be set on the DOM node, so the component keeps an internal ref and syncs it. Miss that and your 'select all' header checkbox silently renders unchecked.

Select all

Option AOption BOption C

Radio

Same name groups them; the browser then handles arrow-key navigation and the roving tab stop for you. Reimplementing that on divs is the usual reason radio groups end up keyboard-hostile.

HobbyFreePro$20 / monthEnterpriseContact sales

Switch

role=switch, so assistive tech announces on/off rather than checked/unchecked. The thumb uses the spring easing — the one place in the system where overshoot is the right call.

Live updatesSmallLargeDisabled

Choosing between them

Checkbox

Independent options staged for submit. Any number can be on.

Radio

One of a small, visible set. Staged for submit.

Switch

Takes effect the moment you flip it. No Save button.