<form>
  <div class="form-check">
    <input type="radio" class="form-check-input" id="male" name="gender" />
    <label class="form-check-label" for="male">Male</label>
  </div>
  <div class="form-check">
    <input type="radio" class="form-check-input" id="female" name="gender" />
    <label class="form-check-label" for="female">Female</label>
  </div>
  <div class="form-check">
    <input type="radio" class="form-check-input" id="disabled" disabled name="gender" />
    <label class="form-check-label" for="disabled">Disabled</label>
  </div>
  <div class="form-check">
    <input type="radio" class="form-check-input" id="disabled-checked" disabled checked name="gender" />
    <label class="form-check-label" for="disabled-checked">Default</label>
  </div>
</form>
body {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}
View Compiled

External CSS

  1. https://cdn.jsdelivr.net/gh/alphardex/aqua.css/dist/aqua.min.css

External JavaScript

This Pen doesn't use any external JavaScript resources.