Radio
Custom-styled radio buttons using BEM markup within a fieldset.
Radio group
Preview
<fieldset class="nano-radio-group">
<legend class="nano-radio-group__legend">Plan</legend>
<div class="nano-radio">
<input type="radio" id="plan-free" name="plan" value="free" class="nano-radio__input" checked>
<label for="plan-free" class="nano-radio__label">Free</label>
</div>
<div class="nano-radio">
<input type="radio" id="plan-pro" name="plan" value="pro" class="nano-radio__input">
<label for="plan-pro" class="nano-radio__label">Pro — $9/mo</label>
</div>
<div class="nano-radio">
<input type="radio" id="plan-enterprise" name="plan" value="enterprise" class="nano-radio__input">
<label for="plan-enterprise" class="nano-radio__label">Enterprise — Contact us</label>
</div>
</fieldset>