Updated: September 19, 2016

Checkbox

Intro

A checkbox lets the user set a binary value. When the user clicks or taps the checkbox, it toggles between checked and unchecked. Check the checkbox to choose the item and apply the state described by the checkbox text.

Do

  • Use checkbox group if you want users to select several values.
  • When using a checkbox group in a form, show group label and first option in the same row and all following options show below the first option.
  • Use a single checkbox if you want users to indicate they agree with a state.
  • When using a single checkbox, phrase the checkbox state as a positive.
  • Wrap long text.

Don’t

  • Don’t use empty labels to arrange the checkboxes.
  • Don’t truncate long text.
  • When using a single checkbox, don’t phrase the state in negative words.