The password Type

Live Demo

Firefox	Safari	Safari	Chrome	Opera	IE	Android

The Low Down

The password input type is used to create an obscured text control.

• Other than dirname and list, the password input type accepts the same attributes as the text input type: you can basically use password for any input control where you want to obscure the content the user enters.
• Attributes supported in theory by the password input type include autocomplete, inputmode, maxlength, minlength, pattern, placeholder, readonly, required, and size. Inputmode and minlengthare not yet supported in any browser. Autocomplete should be set to off: autocomplete="off".
• When a dynamic keypad is used for data entry, many browsers will temporarily display each character as it is entered for better user experience (it’s easy to typo when a key is so tiny).
• To make any non-GUI input type appear obfuscated in Safari, Opera and Chrome you can include -webkit-text-security with the value of disc, circle, square, or none. This will not alter the appearance of the password input type, however, because of the inclusion of

input[type="password"] { -webkit-text-security: disc !important;}

in the User Agent stylesheet. While you can overwrite CSS in your UA StyleSheet, you can’t overwrite any !important found there. Example

• What obfuscated, the password input type is not actually secure. The value is passed unobfuscated and not encrypted, so always, at minimum, use method="post" over SSL.