Skip to main content
UI Guides

Search rules

Search all UI Guides rules by name, category, or source

contentVercel

Mark Untranslatable Strings

MUST

MUST: Wrap brand names, code tokens, commands, and identifiers in `translate="no"` so browser auto-translate leaves them runnable while the surrounding prose stays translatable.

Wrap brand names, code tokens, and identifiers in translate="no" so machine translation leaves them alone

<code translate="no">npm install vercel</code>

Bad

Good

Why it matters

Browser auto-translate rewrites every text node it can reach, including shell commands, env var names, and product names, which turns "npm install vercel" into something that does not run. The HTML translate attribute (and Google's equivalent notranslate class) marks those subtrees as off-limits while leaving the surrounding prose translatable.

References

Built by Gleb Stroganov, design engineer at Evil Martians.

The rules come from other people's skills and guidelines — Vercel, Rauno Freiberg, @Ibelick, impeccable, Emil Kowalski, Tailwind, RAMS — each one credited on the Sources page. The work here is extraction and wiring: every rule is pulled into one corpus, given a good and a bad example you can operate, a MUST/SHOULD/NEVER rule an agent can paste, and a link back to where it came from.