Checkbox
FormsCheckbox with visible label, focus ring, and optional description line.
Rendering preview
<fieldset class="cb-fieldset"> <legend class="cb-legend">Notifications</legend> <label class="cb"> <input type="checkbox" class="cb__input" checked /> <span class="cb__box" aria-hidden="true"><span class="cb__tick">✓</span></span> <span class="cb__text"> <span class="cb__title">Product updates</span> <span class="cb__desc">Release notes and roadmap, at most monthly.</span> </span> </label> <label class="cb"> <input type="checkbox" class="cb__input" /> <span class="cb__box" aria-hidden="true"><span class="cb__tick">✓</span></span> <span class="cb__text"> <span class="cb__title">Security alerts</span> <span class="cb__desc">Critical incidents affecting your workspace.</span> </span> </label></fieldset>