<!-- With caption -->
<div class="FormControl-checkbox-wrap">
<input name="my-check-box1" type="hidden" value="0" autocomplete="off" /><input aria-describedby="caption-07c32237-ca78-47ab-98b8-1a4f1fc2c564" class="FormControl-checkbox" type="checkbox" value="1" name="my-check-box1" id="my-check-box1" />
<span class="FormControl-checkbox-labelWrap">
<label class="FormControl-label" for="my-check-box1">
Jean-Luc Picard
</label> <span class="FormControl-caption" id="caption-07c32237-ca78-47ab-98b8-1a4f1fc2c564">With a caption</span>
</span>
</div>
<!-- Checked -->
<div class="FormControl-checkbox-wrap">
<input name="my-check-box1" type="hidden" value="0" autocomplete="off" /><input class="FormControl-checkbox" type="checkbox" value="1" checked="checked" name="my-check-box1" id="my-check-box1" />
<span class="FormControl-checkbox-labelWrap">
<label class="FormControl-label" for="my-check-box1">
Jean-Luc Picard
</label>
</span>
</div>
<!-- Visually hidden label -->
<div class="FormControl-checkbox-wrap">
<input name="my-check-box2" type="hidden" value="0" autocomplete="off" /><input class="FormControl-checkbox" type="checkbox" value="1" name="my-check-box2" id="my-check-box2" />
<span class="FormControl-checkbox-labelWrap">
<label class="sr-only FormControl-label" for="my-check-box2">
Jean-Luc Picard
</label>
</span>
</div>
<!-- Disabled -->
<div class="FormControl-checkbox-wrap">
<input name="my-check-box4" disabled="disabled" type="hidden" value="0" autocomplete="off" /><input disabled="disabled" class="FormControl-checkbox" type="checkbox" value="1" name="my-check-box4" id="my-check-box4" />
<span class="FormControl-checkbox-labelWrap">
<label class="FormControl-label" for="my-check-box4">
Jean-Luc Picard
</label>
</span>
</div>