translate
The translate global attribute is an enumerated attribute that is used to specify whether an element's translatable attribute values and its Text node children should be translated when the page is localized, or whether to leave them unchanged.
It can have the following values:
empty string or yes, which indicates that the element should be translated when the page is localized.
no, which indicates that the element must not be translated.
Although not all browsers recognize this attribute, it is respected by automatic translation systems such as Google Translate, and may also be respected by tools used by human translators. As such it's important that web authors use this attribute to mark content that should not be translated.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 19 | 79 | 111 | 6 | 25 | 6 | |
| DOM API | ||||||
| The translate property of the HTMLElement interface indicates whether an element's attribute values and the values of its Text node children are to be translated when the page is localized, or whether to leave them unchanged. | 19 | 79 | 111 | 6 | 25 | 6 |
Syntax
<p>For inquiries, please contact <span translate="no">support@example.com</span>.</p>
<p>Email: <code translate="no">npm install</code></p>Live demo
Protect product names
Keep brand names or code-like terms out of automatic page translation.
Localized UI labels
Mix translatable labels with fixed names such as account plans or brand tags.
Translation hint comparison
Compare content that translation tools may translate with content marked as fixed.
Use cases
-
Brand and product terms
Keep product names, version labels, or internal terms stable across translation tools.
-
Code and identifiers
Mark snippets or command-like content as non-translatable when the literal text matters.
Cautions
- translate is a hint, not a full localization system, so it should complement rather than replace proper content workflows.
- Use it narrowly so genuinely translatable UI text still reaches users in their preferred language.
Accessibility
- Preventing accidental translation can preserve clarity for labels, commands, and brand terms that users depend on.
- Combine translate with accurate lang metadata so assistive technologies still understand how the text should be announced.