Checkbox

Checkboxes allow the user to select multiple options from a set.

npm version

npm install @vrembem/checkbox
@import "@vrembem/checkbox/index";

checkbox

<span class="checkbox">
  <input type="checkbox" class="checkbox__native">
  <span class="checkbox__background">
    <span class="checkbox__box">
      <span class="checkbox__icon"></span>
    </span>
  </span>
</span>

For indeterminate checkboxes, apply the aria-checked="mixed" attribute and init the checkbox component script.

import { Checkbox } from "@vrembem/checkbox"
new Checkbox({ autoInit: true })

checkbox + label

<label>
  <span class="checkbox">
    <input type="checkbox" class="checkbox__native">
    <span class="checkbox__background">
      <span class="checkbox__box">
        <span class="checkbox__icon"></span>
      </span>
    </span>
  </span>
  Checkbox with a label
</label>