HTML autocomplete Attribute

The HTML autocomplete attribute provides a hint about whether a browser may automatically fill a form or form control and, for individual controls, what type of information is expected. It can make forms faster and easier to complete by allowing browsers to reuse information the user has previously entered or stored.

Syntax

The autocomplete attribute can be placed on a <form> element or on supported form controls such as <input>, <select>, and <textarea>.

<form autocomplete="on">
  ...
</form>

On an individual form control, the value can describe the type of information the browser should offer to autofill:

<input type="email" name="email" autocomplete="email">

Attribute Values

The autocomplete attribute can use the general values on and off. Individual form controls can also use autocomplete tokens that identify the expected information.

Value Description
on Allows the browser to provide automatic completion when appropriate.
off Indicates that the browser should not automatically complete the field or form.
Autocomplete tokens Identify the specific type of information expected by an individual form control, such as a name, email address, telephone number, or postal code.

Elements That Use the autocomplete Attribute

The autocomplete attribute is currently valid on the <form> element and on supported <input>, <select>, and <textarea> form controls.

Element Description
<form> Controls the default autocomplete behavior for eligible controls within the form.
<input> Controls autofill behavior and can identify the type of information expected by supported input types.
<select> Can identify the type of information represented by the selection control.
<textarea> Can identify the type of information expected in the multiline text control.

Using the autocomplete Attribute

Using specific autocomplete tokens helps the browser understand the purpose of each form control. For example, a contact form can identify fields for a person's name and email address:

<label for="name">Name:</label>
<input type="text" id="name" name="name" autocomplete="name">

<label for="email">Email:</label>
<input type="email" id="email" name="email" autocomplete="email">

If the browser has suitable information available and the user's settings permit autofill, it can offer the appropriate stored values for these controls.

Autocomplete Tokens

Autocomplete tokens describe the purpose of a form control. Common tokens include values for names, contact information, addresses, usernames, and passwords.

Token Expected Information
name Full name.
given-name Given or first name.
family-name Family or last name.
email Email address.
tel Telephone number.
street-address Street address, which may contain multiple lines.
postal-code Postal or ZIP code.
username Username or account name.
current-password Current password for an existing account.
new-password New password being created or changed.

These are only some of the available tokens. More specialized tokens can identify address components, telephone number components, payment information, dates, and other commonly entered data.

Form and Form Control Values

When autocomplete is specified on a <form>, it provides the default autocomplete setting for eligible controls within that form.

<form autocomplete="off">
  <input type="text" name="search">
</form>

An individual form control can specify its own autocomplete value instead of relying on the form's setting.

<form autocomplete="off">
  <input type="text" name="name" autocomplete="name">
</form>

Using specific tokens on individual controls usually gives the browser more useful information than simply enabling autocomplete for the entire form.

autocomplete vs. autocapitalize

The autocomplete and autocapitalize attributes both affect data entry, but they control different behaviors.

Attribute Purpose
autocomplete Helps the browser determine whether and what stored information may be offered for a form control.
autocapitalize Provides a hint about how newly entered text should be automatically capitalized.
<input type="text" name="name"
       autocomplete="name"
       autocapitalize="words">

The attributes can be used together because one controls autofill while the other controls automatic capitalization during text entry.

Common Mistakes

Do not use arbitrary words as autocomplete tokens. Use the standardized values that describe the information expected by the control.

<!-- Correct -->
<input type="email" name="email" autocomplete="email">

Do not assume that autocomplete="off" guarantees that every browser will prevent all autofill behavior. Browsers may apply their own autofill and password-management behavior in some situations.

Do not use a token that describes different information from the field itself. Accurate autocomplete tokens help browsers and assistive technologies understand the purpose of form controls.

Browser Support

Baseline: Widely available indicates a feature has been supported by core browsers for at least 30 months. At this stage, the feature is considered stable and safe for most websites to use without needing to worry about compatibility issues or fallbacks, as it is supported by the vast majority of users' devices and browser versions.

The autocomplete attribute is widely supported, but behavior can vary by element, autocomplete token, browser settings, and stored user information.

Checking Browser Support

For current browser compatibility information, visit Can I Use? . Search for the HTML element or attribute you want to check. You can also narrow your search by entering an element name and attribute name separated by a colon. Search results can include related HTML features, element attributes, input types, APIs, and other technologies, so select the result that most closely matches the feature you are checking.

Try the autocomplete Attribute

The example uses autocomplete tokens for a name, email address, and telephone number. If your browser has matching information stored, it may offer appropriate values when you interact with the controls.

Play in Editor

Summary

The HTML autocomplete attribute provides information about browser autofill behavior for forms and form controls. The values on and off control general autocomplete behavior, while standardized tokens such as name, email, tel, and postal-code identify the information expected by individual controls. Using accurate autocomplete values can make forms faster, easier, and more accessible for users to complete.