Os nossos voluntários ainda não traduziram este artigo para Português (Europeu). Junte-se a nós e ajude-nos a fazer o trabalho!
Pode também ler o artigo em English (US).

The font-variation-settings CSS property provides low-level control over OpenType or TrueType font variations, by specifying the four letter axis names of the features you want to vary, along with their variation values.

/* Use the default settings */
font-variation-settings: normal;

/* Set values for OpenType axis names */
font-variation-settings: "XHGT" 0.7;

/* Global values */
font-variation-settings: inherit;
font-variation-settings: initial;
font-variation-settings: unset;

This works at an even lower level than font-feature-settings, which instead allows you to specify font feature tags and values.

Note: Whenever possible, Web authors should use other methods of controlling font display, like the font-variant shorthand property or an associated longhand property. This property is a low-level feature designed to handle special cases where no other way to enable or access an OpenType font feature exists.

Initial valuenormal
Applies toall elements. It also applies to ::first-letter and ::first-line.
Inheritedyes
Mediavisual
Computed valueas specified
Animation typea transform
Canonical orderper grammar

Syntax

This property can take one of two forms:

  • The keyword value normal
  • A <string> followed by a <number>. This may be repeated, with the <string> <number> tuples separated by commas.

Values

normal
Text is laid out using default settings.
<string> <number>
When rendering text, the list of OpenType axis names is passed to the text layout engine to enable or disable font features. Each setting is always a <string> of 4 ASCII characters, followed by a <number> indicating the axis value. If the <string> has more or fewer characters or contains characters outside the U+20 - U+7E codepoint range, the whole property is invalid. The <number> can be fractional or negative.

Formal syntax

normal | [ <string> <number> ]#

Examples

TBD

Specifications

Specification Status Comment
CSS Fonts Module Level 4
The definition of 'font-variation-settings' in that specification.
Working Draft Initial definition

Browser compatibility

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support62 No1532 No49113
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support6262 No153249114 No

1. In development.

2. From version 53: this feature is behind the layout.css.font-variations.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.

3. Requires macOS 10.13 High Sierra or later.

4. Requires iOS 11 or later.

See also

Etiquetas do documento e contribuidores

 Contribuidores para esta página: fscholz, mfluehr, KrasnayaPloshchad, Siilwyn, sergejr, wbamberg, behnam, chrisdavidmills
 Última atualização por: fscholz,