Checkbox

Accessible checkboxes with a custom mark and an indeterminate state.

Source: src/stylus/components/checkbox.styl

Default

Wrap the input and its text in .checkbox-field so the whole label is a hit target.

<label class="checkbox-field">
  <input type="checkbox" class="checkbox" checked />
  <span>Auto-sync with remote origin</span>
</label>

Sizes

Add .sm or .lg to the input.

<label class="checkbox-field">
  <input type="checkbox" class="checkbox sm" checked />
  <span>Small</span>
</label>
<label class="checkbox-field">
  <input type="checkbox" class="checkbox lg" checked />
  <span>Large</span>
</label>