Checkbox

When to use

Use when there are lists of options and the user may select any number of choices. Each checkbox operates independently.

Standalone checkboxes work for single on/off settings like "Remember me" or "I agree to terms".

When not to use

For mutually exclusive options, use RadioButton. For a single on/off toggle with immediate effect, use ToggleSwitch.

Guidelines

  • Vertical layout: Arrange options vertically, one per line, for easy scanning.
  • Positive wording: Use "Send me updates" not "Don't send me updates". Avoid negations.
  • Default to unchecked: Leave checkboxes blank by default so users actively opt in.
  • Clickable labels: Let users click either the checkbox or its label. larger target area.
  • Group visually: Use subheads for long lists, but keep related options together.

How it works

Selected: [ "a" ]