Checkbox & Radio

Native form controls styled via pure CSS using @utility checkbox, @utility radio, @utility check-group, and @utility check-label.

Checkboxes (Primary)

Remember device Subscribe to newsletter

Radio Buttons (Danger)

Erase data Keep data

Usage

checkbox-radio.html

<!-- Checkbox -->
<label class="check-group">
  <input type="checkbox" class="checkbox" />
  <span class="check-label">Label text</span>
</label>

<!-- Radio -->
<label class="check-group">
  <input type="radio" class="radio" name="options" />
  <span class="check-label">Label text</span>
</label>