Widely available Essential for multilingual content and important even on single-language pages because it shapes pronunciation and language-specific behavior.

lang

The lang global attribute helps define the language of an element: the language that non-editable elements are written in, or the language that the editable elements should be written in by the user. The attribute contains a single BCP 47 language tag.

Note: If the value of lang is set to an empty string, the language is explicitly unknown. Therefore, it is recommended to always specify an appropriate value for this attribute.

LanguageGlobal attributeAccessibility

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
lang
1
12
1
≤4
18
≤3.2
DOM API
lang

The lang property of the HTMLElement interface indicates the base language of an element's attribute values and text content, in the form of a BCP 47 language tag. It reflects the element's lang attribute; the xml:lang attribute does not affect this property.
1
12
1
3
18
1
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)

Syntax

HTML 
<html lang="ja">
<body>
  <p>Japanese text</p>
  <p lang="en">This is English text.</p>
  <blockquote lang="fr">C'est la vie.</blockquote>
</body>
</html>

Live demo

Mixed-language article

Declare the language of each fragment so pronunciation and styling stay accurate.

PreviewFullscreen

Language-aware labels

Style labels differently with :lang() while keeping the source text intact.

PreviewFullscreen

Quoted names and terms

Use nested lang values for titles, names, and quoted content inside a card.

PreviewFullscreen

Use cases

  • Page language declaration

    Set the primary language of the document so pronunciation, spellchecking, and translation start from the correct assumption.

  • Inline language changes

    Mark quotations, names, or phrases in another language so assistive tech can switch pronunciation appropriately.

Cautions

  • Setting the wrong language can be worse than omitting it because it affects pronunciation and language tools incorrectly.
  • Remember that nested content can need its own lang value when the language changes within the page.

Accessibility

  • Correct language metadata is especially important for screen reader pronunciation and translation support.
  • Use language changes sparingly but accurately wherever the content actually changes language.

Related links