Components

Checkboxes

The checkbox component is to be used when you want users to select more than one option.

Example

                                
                                <div class="form__control form__checkbox"><input type="checkbox" id="label-test"/><label class="form__label" for="label-test"> Label for the checkbox </label></div>
<div class="form__control form__checkbox"><input type="checkbox" id="label-test2"/><label 
class="form__label" for="label-test2"> Label for the checkbox </label></div>
<div class="form__control form__checkbox"><input type="checkbox" id="label-test3"/><label class="form__label" for="label-test3"> Label for the checkbox </label></div>

When to use this

You should use the checkbox component when:

  • Selectable options from a list
  • Toggle a single option on or off

When not to use this

You should not use this component when a user can only select from one option. Use radio buttons component instead.

Back to top