How to add a checkbox in forms using HTML ?

Last Updated : 29 Sep, 2021

In this article, we will learn how to add a checkbox in HTML Forms. Basically, the checkbox is used to select one or more options from a variety of options. It is a multi-control unit that will be presented as a small square box on the screen. Normally, Checkbox has 3 states namely- Checked, unchecked & indeterminate. It is required in forms when the user allows choosing multiple choices.

Approach: We have a simple approach to complete the task that given below-

Firstly, create an HTML document that contains a <input> tag.
Now use the type attribute with <input> element.
Set the type attribute to value “checkbox”

Syntax

<input type="checkbox">

Example:

HTML

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
        How to add a checkbox in  
        forms using HTML? 
    </title> 
</head> 
  
<body style="text-align: center;"> 
    <h1 style="color:green;"> 
        GeeksforGeeks 
    </h1> 
  
    <h2> 
        How to add a checkbox in  
        forms using HTML? 
    </h2> 
  
    <form> 
        <h4> 
            choose any your 2 favourite Dishes 
        </h4> 
  
        Rajna chawal --> 
        <input type="checkbox" name="dish1" 
            id="GFG" value="Rajma chawal" checked> 
        <br> 
  
        Shahi paneer --> 
        <input type="checkbox" name="dish2" 
            value="Shahi paneer"> 
        <br> 
  
        Kadi Chawal --> 
        <input type="checkbox" name="dish3" 
                value="kadi Chawal"> 
        <br> 
  
        Idli Sambhar --> 
        <input type="checkbox" name="dish4" 
            value="Idli sambhar"> 
        <br> 
        <input type="submit" value="submit"> 
    </form> 
    <br> 
</body> 
  
</html>