Radio Buttons

Component Goals

• Easy drop-in of a standard radio button

• Easy drop-in of a customized radio button

• Easy variations on customization ( icons, colors, etc. )

• Finsweet

  • Easy, optional support for FS List Filter attributes

HTML

Webflow has two versions of this HTML;

Standard Radio Button

<label class="w-radio">
<input type="radio" name="Radio" id="radio" data-name="Radio" class="w-form-formradioinput w-radio-input" value="Radio">
<span class="w-form-label" for="radio">Radio</span>
</label>

Custom Radio Button

<label class="w-radio">
<div class="w-form-formradioinput w-form-formradioinput--inputType-custom w-radio-input"></div>
<input type="radio" name="Radio" id="radio" data-name="Radio" style="opacity:0;position:absolute;z-index:-1" value="Radio">
<span class="w-form-label" for="radio">Radio</span>
</label>