Web development

HTML Radio Buttons

HTML Radio Buttons

The HTML <input type=”radio”> specifies a radio button.

Radio buttons are usually in the groups. You can select only one radio button (one option) at the same time.


<input type="radio">


<!DOCTYPE html>

<form action="">
  <p>Select your favourite colour:</p>
  <input type="radio" id="blue" name="colour" value="blue">
  <label for="blue">Blue</label><br>
  <input type="radio" id="pink" name="colour" value="pink">
  <label for="pink">Pink</label><br>
  <input type="radio" id="yellow"name="colour" value="yellow">
  <label for="yellow">Yellow</label><br>
  <input type="radio" id="other" name="colour" value="other">
  <label for="other">Other</label>



Note: Always add the <label> tag.

Click here to see how to style the HTML Radio buttons using CSS.

Enjoy coding!

Read also:

HTML Checkbox

CSS :checked Selector