concept · HTML

Autocorrect Playground

Type the same text into both columns and watch how OS autocorrection treats each field. On devices with autocorrect enabled, the left column lets the browser fix your typing; the right column passes every keystroke through untouched.

Try typing: "Im gong hme tonite" — autocorrect on will silently fix it; autocorrect off will leave it exactly as typed.

Note: autocorrect is an OS/browser feature — on desktop you may need a mobile device or a platform with autocorrect enabled to see the difference clearly.

autocorrect="on" — corrections allowed
Plain text input autocorrect="on"
Textarea autocorrect="on"
contenteditable autocorrect="on"
Type here…
Username autocorrect="on" (bad default)
autocorrect="off" — exact input preserved
Plain text input autocorrect="off"
Textarea autocorrect="off"
contenteditable autocorrect="off"
Type here…
Username autocorrect="off" (correct)
Before the autocorrect attribute, Chrome had no standard way to disable OS-level autocorrection on a text field. Using spellcheck="false" suppresses the wavy underline but does not stop silent word replacement. Using type="email" or type="url" suppresses autocorrect as a side-effect but changes keyboard layout and validation semantics. autocorrect="off" is the precise, intent-revealing fix.

the HTML

<!-- Let autocorrect help: prose fields, chat, notes --> <textarea autocorrect="on"></textarea> <!-- Stop autocorrect: technical fields --> <input autocorrect="off" type="text" placeholder="username"> <input autocorrect="off" type="text" placeholder="API key"> <!-- Inherit off from a container --> <form autocorrect="off"> <input type="text" placeholder="email"> <!-- inherits off --> <textarea autocorrect="on"></textarea> <!-- overrides to on --> </form>

see also

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗