Basic
Add radio buttons to a group by adding the name attribute along with the same corresponding value for each of the radio buttons in the group. Create disabled radio buttons by adding the disabled attribute as shown below.
Radio Buttons
bookmarkRadio Buttons are used when the user must make only one selection out of a group of items. The forattribute is necessary to bind our custom radio button with the input. Add the input's idas the value of the forattribute of the label.
Custom Colors
You can easily make your own radio button color by creating a custom CSS class. Take a look at the example below where we add a radio button red color.
<p> <label> <input name="group2" type="radio" class="red" checked /> <span>Basic checked style</span> </label></p><p> <label> <input class="with-gap red" name="group2" type="radio" /> <span>With gap unchecked style</span> </label></p>[type="radio"].red:checked+span:after,[type="radio"].with-gap.red:checked+span:before,[type="radio"].with-gap.red:checked+span:after { border: 2px solid #f44336;}[type="radio"].red:checked+span:after,[type="radio"].with-gap.red:checked+span:after { background-color: #f44336;}