Checking editable text with HTML spellcheck
Browsers can check spelling and, in some cases, grammar inside editable elements. The global HTML spellcheck attribute lets you request that behaviour explicitly.
<input type="text" spellcheck="true">
<input type="text" spellcheck="false">
spellcheck="true" asks the browser to check the text. spellcheck="false" turns the check off, which can be useful for usernames, product codes, or other values that a dictionary will mostly misunderstand.
The exact checking interface depends on the browser, operating system, and language settings. This attribute is a hint to the browser, not a replacement for validating submitted data.
Enjoyed reading this?
If you found this article helpful, consider supporting my writing. Every little bit helps keep this blog going.
Related articles
- Choosing Between srcset and picture
Choose srcset when the image stays the same and picture when the crop, composition, or format needs to change.
- Finding Hidden Content With hidden="until-found"
Let Find in Page and fragment navigation reveal collapsed content with hidden=until-found, while keeping a usable fallback.
- HTML Features That Can Save You Some JavaScript
Use native disclosures, dialogs, popovers, form attributes, and responsive images before rebuilding their basic behaviour.