autocapitalize

Controls automatic capitalization on mobile virtual keyboards. Pair with inputmode for complete mobile keyboard control.

Overview

The autocapitalize attribute controls whether and how the virtual keyboard automatically capitalizes text as the user types. It affects only mobile and tablet virtual keyboards — physical keyboards and desktop browsers are unaffected.

Applies to: <input> (text types), <textarea>, and any element with contenteditable

Values

Value	Behavior	Use Case
`none` / `off`	No automatic capitalization	Usernames, email addresses, URLs, codes
`sentences`	Capitalize the first letter of each sentence (the default)	General prose, comments, descriptions
`words`	Capitalize the first letter of each word	Name fields, titles, headings
`characters`	All characters uppercase	License plates, booking references, country codes

<label for="bio">Bio</label> <textarea id="bio" autocapitalize="sentences" rows="3"></textarea>  <label for="full-name">Full Name</label> <input type="text" id="full-name" autocapitalize="words" autocomplete="name" />  <label for="handle">Username</label> <input type="text" id="handle" autocapitalize="none" />

Practical Examples

All-Caps Input

Use characters for fields where the value is always uppercase. The keyboard shifts to caps lock mode so the user does not need to toggle it manually.

<label for="plate">License Plate</label> <input type="text" id="plate" autocapitalize="characters" maxlength="8" placeholder="ABC 1234" />  <label for="booking">Booking Reference</label> <input type="text" id="booking" autocapitalize="characters" maxlength="6" pattern="[A-Z0-9]{6}" placeholder="XK49BT" />

Registration Form

A complete form demonstrating appropriate autocapitalize values for different field types.

<form class="stacked"> <label for="first-name">First Name</label> <input type="text" id="first-name" autocapitalize="words" autocomplete="given-name" /> <label for="last-name">Last Name</label> <input type="text" id="last-name" autocapitalize="words" autocomplete="family-name" /> <label for="email">Email</label> <input type="email" id="email" autocomplete="email" /> <label for="username">Username</label> <input type="text" id="username" autocapitalize="none" autocomplete="username" /> <label for="notes">Notes</label> <textarea id="notes" autocapitalize="sentences" rows="3"></textarea> <button type="submit">Create Account</button> </form>

Contenteditable

The attribute also works on contenteditable elements, providing the same keyboard behavior outside of form fields.

<div contenteditable="true" autocapitalize="sentences"> Start typing here. The first letter of each sentence will be capitalized. </div>

Pairing with inputmode

For complete mobile keyboard control, combine autocapitalize with inputmode. Together they determine both the keyboard layout and the capitalization behavior:

inputmode="text" autocapitalize="words" — text keyboard with title-case capitalization for name fields
inputmode="text" autocapitalize="none" — text keyboard with no auto-caps for usernames
inputmode="url" — URL keyboard (autocapitalize has no effect since URLs are case-insensitive in practice)

Automatic Handling

Some input types ignore autocapitalize because the browser already knows the correct behavior:

type="email" — no capitalization (email addresses are lowercase)
type="url" — no capitalization
type="password" — no capitalization

For these types, setting autocapitalize has no effect. The browser does the right thing automatically.

Accessibility

No impact on assistive technology. The autocapitalize attribute does not change how screen readers announce the field or its content.
Reduces input friction. Correct capitalization settings prevent mobile users from needing to manually toggle Shift, which is especially helpful for users with motor impairments.
Pair with autocomplete. Fields like names benefit from both autocapitalize="words" and autocomplete="name" — the former helps manual entry while the latter enables autofill.

Limitations

Desktop has no effect: Physical keyboards and desktop browsers ignore this attribute entirely. It is purely a mobile optimization.
Keyboard-app dependent: Virtual keyboard apps may interpret values differently. Most major keyboards (iOS, Gboard, Samsung Keyboard) support all four values, but third-party keyboards may not.
Suggestion only: The attribute is a hint, not a constraint. Users can still manually change capitalization. It does not validate or transform the submitted value.
No mid-word control: You cannot capitalize specific characters within a word (e.g., camelCase). The attribute operates at the sentence, word, or character level only.