How to create a password input box in an HTML page

Password Input Box

In HTML, password input box is used for entering and capturing sensitive information like passwords.

It masks the entered characters to enhance security.

How to Create a Password Input Box

Create an HTML <input> element.

Add type="password" (type attribute with value 'password') to the <input> element. Type attribute value is set to 'password' to define the input element as a password input box.

Add name="myPassword" (name attribute with value 'myPassword') to define the name of the <input> element.

A label <label>Password:</label> has been added before the input element.

Have a look at the following example:

Example of Password Input Box


Output of the above code example

Example of Password Input Box in a Webpage


Type a password in the password input box and see how it masks your password to enhance security.

Live Code Playground

In the following HTML code editor, you can practice the above code by adding more password input boxes. Click on the 'Run Code' button to render the code; the rendered page will be displayed in the following HTML Code Output frame. Practice until you become comfortable and proficient with your code.

HTML logo HTML Online Editor
HTML Code Output