The HTML <input type="password"> element is a specific version of the <input> element, used to create an input field accepting a password.
The browser will generate a input field for entering, and changing, the password. The data which the user enters will be displayed in a Asterisks character, this character can vary from browser to browser.
| Content categories | Flow content, listed, submittable, resettable, form-associated element, phrasing content, labellable element, palpable content. |
|---|---|
| Permitted content | None, it is an empty element. |
| Tag omission | Must have a start tag and must not have an end tag. |
| Permitted parent elements | Any element that accepts phrasing content. |
| DOM interface | HTMLInputElement |
Attributes
Beside the attributes listed below, this element can have any of the global attributes.
autocompleteHTML5- Sets the value of the autocomplete attribute of a password field. If true, automatically fills it with the previously stored value for the password field.
autofocusHTML5- This Boolean attribute lets you specify that a form field should have input focus when the page loads, unless the user overrides it, for example, by typing in a different field. Only one form element in a document can have the autofocus attribute, which is a Boolean.
disabled-
This Boolean attribute indicates that the password field is not available for interaction. Additionally, disabled field values aren't submitted with the form.
defaultvalue- Sets the default value of a password field.
inputmodeHTML5- A hint to the browser for which keyboard to display.Possible values are:
verbatim: Alphanumeric, non-prose content such as usernames and passwords.latin: Latin-script input in the user's preferred language with typing aids such as text prediction enabled. For human-to-computer communication such as search boxes.latin-name: As latin, but for human names.latin-prose: As latin, but with more aggressive typing aids. For human-to-human communication such as instant messaging or email.full-width-latin: As latin-prose, but for the user's secondary languages.kana: Kana or romaji input, typically hiragana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.katakana: Katakana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.
maxlength- Sets the value of the maxlength attribute of a password field.
minlength- Sets the value of the minlength attribute of a password field.
name- The name of the field, which is submitted with the form data.
patternHTML5- Sets the value of the pattern attribute of a password field.
placeholderHTML5- Sets the value of the placeholder attribute of a password field.
readonly- This Boolean attribute indicates that the user cannot modify the value of the password field.
requiredHTML5- This Boolean attribute specifies that the user must fill in a value before submitting a form.
size- Sets the value of the size attribute of a password field.
Examples
To create a widget to display a password, use:
<input type="password">
To create a widget to display a password with pattern, use:
<input type="password" pattern=".{6,}">
The above example will create password element that must contain 6 or more characters.
Specifications
| Specification | Status | Comment |
|---|---|---|
| WHATWG HTML Living Standard The definition of '<input>' in that specification. |
Living Standard | |
| HTML5 The definition of '<input>' in that specification. |
Recommendation | |
| HTML 4.01 Specification The definition of '<form>' in that specification. |
Recommendation |
Browser compatibility
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Basic support | 1.0 | 1.0 (1.7 or earlier) | 2 | 1.0 | 1.0 |
| accesskey | 1.0 | (Yes) | 6 | 1.0 | ? |
| autocomplete | 17.0 | 4.0 (2.0) | 5 | 9.6 | 5.2 |
| autofocus | 5.0 | 4.0 (2.0) | 10 | 9.6 | 5.0 |
| disabled | 1.0 | 1.0 (1.7 or earlier)[4] | 6 | 1.0 | 1.0 |
| form | 9.0 | 4.0 (2.0) | ? | 10.62 | ? |
| formaction | 9.0 | 4.0 (2.0) | 10 | 10.62 | 5.2 |
| formenctype | 9.0 | 4.0 (2.0) | 10 | 10.62 | ? |
| formmethod | 9.0 | 4.0 (2.0) | 10 | 10.62 | 5.2 |
| formnovalidate | 5.0[1] | 4.0 (2.0) | 10 | 10.62 | ? |
| formtarget | 9.0 | 4.0 (2.0) | 10 | 10.62 | 5.2 |
| inputmode | No support | No support | No support | No support | No support |
| list | 20.0 | 4.0 (2.0) | 10 | 9.6 | No support |
| maxlength | 1.0 | 1.0 (1.7 or earlier) | 2 | 1.0 | 1.0 |
| minlength | 40.0 | ? | ? | ? | ? |
| name | 1.0 | 1.0 (1.7 or earlier) | 2 | 1.0 | 1.0 |
| pattern | 5.0 | 4.0 (2.0) | 10 | 9.6 | No support |
| placeholder | 10.0 | 4.0 (2.0) | 10 | 11.00 | 5.0 |
| readonly | 1.0 | 1.0 (1.7 or earlier) | 6[2] | 1.0 | 1.0 |
| required | 5.0 10[3] |
4.0 (2.0) | 10 | 9.6 | No support |
| size | 1.0 | 1.0 (1.7 or earlier) | 2 | 1.0 | 1.0 |
| Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | (Yes) | 4.0 (2.0) | (Yes) | (Yes) | (Yes) |
| accesskey | ? | ? | ? | ? | ? |
| autocomplete | ? | 4.0 (2.0) | (Yes) | (Yes) | (Yes) |
| autofocus | 3.2 | 4.0 (2.0) | ? | (Yes) | ? |
| disabled | (Yes) | 4.0 (2.0) | (Yes) | (Yes) | (Yes) |
| form | ? | ? | ? | ? | ? |
| formaction | ? | 4.0 (2.0) | ? | 10.62 | 5.0 |
| formenctype | ? | ? | ? | ? | ? |
| formmethod | ? | 4.0 (2.0) | ? | 10.62 | 5.0 |
| formnovalidate | ? | 4.0 (2.0) | ? | 10.62 | ? |
| formtarget | ? | 4.0 (2.0) | ? | 10.62 | 5.0 |
| inputmode | No support | No support | No support | No support | No support |
| list | No support | 4.0 (2.0) | ? | (Yes) | ? |
| maxlength | (Yes) | 4.0 (2.0) | (Yes) | (Yes) | (Yes) |
| minlength | ? | ? | ? | 27.0 | ? |
| name | (Yes) | 4.0 (2.0) | (Yes) | (Yes) | 1.0 |
| pattern | ? | 4.0 (2.0) | ? | (Yes) | (Yes) |
| placeholder | 2.3 | 4.0 (2.0) | ? | 11.10 | 4 |
| required | ? | (Yes) | ? | (Yes) | ? |
| size | (Yes) | 4.0 (2.0) | (Yes) | (Yes) | (Yes) |
[1] In 6.0 it only worked with the HTML5 document type, validation support in 7.0 was disabled and re-enabled in 10.0.
[2] Missing for type="checkbox" and type="radio".
[3] Supported for <select> element.
[4] Firefox will, unlike other browsers, by default, persist the dynamic disabled state and (if applicable) dynamic checkedness of an <input> across page loads. Setting the value of the autocomplete attribute to off disables this feature; this works even when the autocomplete attribute would normally not apply to the <input> by virtue of its type. See bug 654072.