DAHLIA Pattern Library

Checkbox 

<div class="checkbox">
    <input id="peach-pie" type="checkbox" name="peach-pie" tab-index="1" />
    <label for="peach-pie">Checkbox 1</label>
    <input id="pear-pie" type="checkbox" name="pear-pie" tab-index="2" />
    <label for="pear-pie">Checkbox 2</label>
</div>
 
<div class="checkbox">
  <input id="{{default name 'peach-pie'}}" type="checkbox" name="{{default name 'peach-pie'}}" {{#if checked }}checked=""{{/if}} tab-index="1" />
  <label for="{{default name 'peach-pie'}}">{{default text 'Checkbox 1'}}</label>
  <input id="{{default name 'pear-pie'}}" type="checkbox" name="{{default name 'pear-pie'}}" {{#if checked }}checked=""{{/if}} tab-index="2" />
  <label for="{{default name 'pear-pie'}}">{{default text 'Checkbox 2'}}</label>
</div>
 
/* No context defined for this component. */

Custom checkboxes cannot be nested within labels.