font-language-override

Definition

The font-language-override property in CSS is used to specify the language system for a text element, overriding the default language specified by the font. This property can be used to ensure that text is displayed correctly in situations where the default font language does not match the language of the content.

Examples

Specify the language system for an element in Arabic script:

h1 {
  font-family: 'Amiri';
  font-language-override: 'arab';
}

Specify the language system for an element in Devanagari script:

h1 {
  font-family: 'Noto Sans Devanagari';
  font-language-override: 'deva';
}

Override the language system of a font for an element in Cyrillic script:

h1 {
  font-family: 'Fira Sans';
  font-language-override: 'cyrl';
}

Values

Best Practices

• Use the font-language-override property sparingly, as it can have unexpected effects on text appearance and readability.
• Use the correct language system code for the script used in the text element. A list of language system codes can be found in the OpenType specification.
• Test your font-language-override settings on different devices and browsers to ensure that they are supported and display correctly.
• Consider using the lang attribute on HTML elements to specify the language of the content, in addition to the font-language-override property.
• Be aware that some fonts may not support the font-language-override property, or may have limited support for certain language systems.

Browser Compatibility