Nice browser. Is it antique?
No, seriously - your browser is so old that some features of patternplate don't work as expected.
Don't worry - you can either continue with a restricted version or install an up-to-date browser.
We messed up.
Sorry, but your user experience might be affected.
- Try reloading the page
- Report the problem at github.com/patternplate/patternplate

Radio Button@1.0.0

<div class="" style="width: 200px">
  
  <div class="c-radio-container">
    <label for="radio-1" class="c-radio__label">Radio 1</label>
    <div class="c-radio">
      <input class="c-radio__native-control" type="radio" id="radio-1" name="radios" checked>
      <div class="c-radio__background">
        <div class="c-radio__outer-circle"></div>
        <div class="c-radio__inner-circle"></div>
      </div>
    </div>
  </div>
  
  <div class="c-radio-container">
    <label for="radio-2" class="c-radio__label">Radio 2</label>
    <div class="c-radio">
      <input class="c-radio__native-control" type="radio" id="radio-2" name="radios" checked>
      <div class="c-radio__background">
        <div class="c-radio__outer-circle"></div>
        <div class="c-radio__inner-circle"></div>
      </div>
    </div>
  </div>
  
  <div class="c-radio-container">
    <label for="radio-3" class="c-radio__label">Radio 3</label>
    <div class="c-radio--dark">
      <input class="c-radio__native-control" type="radio" id="radio-3" name="radios-2" checked>
      <div class="c-radio__background">
        <div class="c-radio__outer-circle"></div>
        <div class="c-radio__inner-circle"></div>
      </div>
    </div>
  </div>
  
  <div class="c-radio-container">
    <label for="radio-4" class="c-radio__label">Radio 4</label>
    <div class="c-radio--dark">
      <input class="c-radio__native-control" type="radio" id="radio-4" name="radios-2" checked>
      <div class="c-radio__background">
        <div class="c-radio__outer-circle"></div>
        <div class="c-radio__inner-circle"></div>
      </div>
    </div>
  </div>
</div>