Input Type Password In HTML: Here’s How To Obfuscate Password Entry Fields

Disclosure: Your support helps keep the site running! We earn a referral fee for some of the services we recommend on this page. Learn more
Value of
How To Define Input Type In HTML (All The Values And Attributes)
What does Input Type Password In HTML: Here’s How To Obfuscate Password Entry Fields do?
Displays an obfuscated password entry field.

Code Example

<form action="myform.cgi">
<input type="password" name="password" id="password" maxlength="6">
<label for="password"> Type a fake password here</label>
<br><input type="submit" value="Submit">
</form>

The password value of the input attribute displays a field where the user can type a password into a form. It’s important to note that this field obfuscates the characters that are typed in, so that passers by cannot read the characters on-screen. However, this doesn’t apply any encryption when the data is actually sent, so don’t rely on a password field to actually secure the data. Obfuscated characters are displayed differently in different browsers. In most cases, they will be replaced with circular bullets, or asterisks.

Restricting Data in Password Fields

The password value of input is rarely used solo. You’ll normally want to specify additional attributes to constrain the data that is entered. We’ve covered these attributes elsewhere, so the section that follows is a brief summary. It’s likely that your database is set to accept a maximum length for the password. To avoid problems with saving passwords, or logging in, it’s good practice to specify a maxlength for the field that corresponds with the setting in your database. Likewise, you can specify a minlength, if your script requires it. Setting a defaultvalue will pre-fill the password field with the value you specify. Likewise, setting the autocomplete attribute will result in any pre-saved value to be entered into the field automatically. Using readonly will prevent the password from being edited. To enforce password rules, use the pattern attribute.

Claire is seasoned technical writer, editor, and HTML enthusiast. She writes for HTML.com and runs a content agency, Red Robot Media.

Browser Support for password

iefirefoxchromeedgesafariopera
AllAllAllAllAllAll