Radio button

You can customize radio buttons by combining different colors. See the basic example bellow:

Source code
<div class="form-group">
  <label class="radio">
    <input type="radio" name="radio-group" checked>
    <span class="check-mark"></span> Apple
  </label>
</div>
<div class="form-group">
  <label class="radio">
    <input type="radio" name="radio-group">
    <span class="check-mark"></span> Peach
  </label>
</div>
<div class="form-group">
  <label class="radio">
    <input type="radio" name="radio-group">
    <span class="check-mark"></span> Orange
  </label>
</div>
You also can use input[type=checkbox] to create radio button components.

Colors

The radio button styles follow the contextual bootstrap colors.

Source code
<label class="radio radio-primary"></label>
<label class="radio radio-success"></label>
<label class="radio radio-danger"></label>
<label class="radio radio-warning"></label>
<label class="radio radio-info"></label>

Disabled state

When adding the disabled boolean attribute to the input element, the appearance changes to reflect this state.

Source code
<label class="radio radio-danger">
  <input type="checkbox" checked disabled>
  <span class="check-mark"></span> You can't change
</label>