Une remarque ? Une suggestion ?...

Merci de participer à l'amélioration de ce site. Prenez le temps de rédiger votre remarque le plus précisément possible :

font-synthesis-weight - Propriété CSS

font-synthesis-weight

Résumé des caractéristiques de la propriété font-synthesis-weight

Description rapide
Définit si le navigateur peut calculer ou non le glyphe des caractères gras.
Statut
Problèmes de compatibilité ⚠
Type de valeur
Valeur prédéfinie
Valeurs prédéfinies
auto | none
Pourcentages
Ne s'applique pas.
Valeur initiale
auto
Héritée par défaut
Oui
Type d'animation
Discrète : lors d'une animation, la propriété font-synthesis-weight passe d'une valeur à l'autre sans transition.
Module W3C
Module CSS - Polices de caractères
Références (W3C)
Statut du document:: WD (document de travail)

Description de la propriété font-synthesis-weight.

font-synthesis-weight autorise ou non le navigateur à générer les caractères gras lorsque ceux-ci ne sont pas définis dans la police. Cependant la plupart des polices incluent au moins une variante de gras.

La synthèse des formes de caractères en gras donne parfois de mauvais résultats, en particulier avec certaines polices fantaisies ou décoratives. La qualité du rendu synthétisé est très variable d'une police à l'autre. Il est parfois préférable de désactiver la synthèse de la graisse avec font-synthesis-weight, et donc d'afficher des caractères standards, non gras. Ou alors de choisir une police comportant les caractères gras de façon native.

On peut également souhaiter désactiver la synthèse du gras sur un texte très long pour réduire les temps de calcul.

Comparaison entre gras natif et gras synthétisé
Comparaison entre gras natif de la police et gras synthétisé (simulation)

Voyez également la propriété résumée font-synthesis qui permet d'activer ou de désactiver la synthèse de façon plus générale (et qui est mieux reconnue par les navigateurs).
Et la propriété font-weight qui détermine l'épaisseur de la graisse des caractères.

Syntaxes pour font-synthesis-weight.

  • font-synthesis-weight: auto;

    Le navigateur peut synthétiser les caractères gras lorsque la police choisie ne comporte pas de variante de graisse.

  • font-synthesis-weight: none;

    Le navigateur n'est pas autorisé à synthétiser les graisses de caractères manquantes dans la police.

  • font-synthesis-weight: initial; font-synthesis-weight: inherit; font-synthesis-weight: revert; font-synthesis-weight: revert-layer; font-synthesis-weight: unset;

    La valeur initiale est : auto.

Animation de la propriété font-synthesis-weight.

L'animation de font-synthesis-weight est théoriquement possible, mais ne présente pas grand intérêt visuel.

Simulateur.

La police choisie est volontairement dépourvue des variantes gras. Le navigateur simule ces attributs, ou pas, en fonction de la valeur donnée à la propriété font-synthesis-weight.

font-synthesis-weight :
Texte en graisse de 100 (thin)
Texte en graisse de 200 (extra light)
Texte en graisse de 300 (light)
Texte en graisse de 400 (regular)
Texte en graisse de 500 (medium)
Texte en graisse de 600 (semi-bold)
Texte en graisse de 700 (bold)
Texte en graisse de 800 (extra bold)
Texte en graisse de 900 (heavy)

Prise en charge par les navigateurs (compatibilité).

font-synthesis-weight est encore mal reconnue par les navigateurs actuels (2022).

1
font-synthesis-weight
Estimation de la prise en charge en pourcentage du parc actuel.
70%

Navigateurs sur ordinateurs :

Navigateurs sur mobiles :

Navigateurs obsolètes ou marginaux :

Androïd Brower

Version testée : 109 (2023)

Chrome

Version testée : 109 (2023)

Chrome pour Androïd

Version testée : 109 (2023)

Edge

Version testée : 109 (2023)

Firefox

Version testée : 109 (2023)

Firefox pour Androïd

Version testée : 107 (2022)

Internet Explorer

Version testée : 11 (2013)

Opéra

Version testée : 92 (2022)

Opéra Mobile

Version testée : 72 (2022)

Safari

Version testée : 16.2 (2022)

Safari sur IOS

Version testée : 16.2 (2022)

Samsung Internet

Version testée : 19.0 (2022)
Voir le site Caniuse.com pour plus d'informations de compatibilité.
Caniuse

Voir aussi, dans le même module de standardisation que font-synthesis-weight.

Les spécifications CSS éditées par le W3C sont organisées en modules. font-synthesis-weight fait partie du Module CSS - Polices de caractères (CSS Fonts Module). Les définitions suivantes sont également décrites dans ce même module.

Propriétés.

Raccourci pour définir la plupart des propriétés concernant les polices de caractères.
⚠
Détermine le comportement du navigateur face aux polices de caractères longues à charger.
✗
Permet d'appliquer quelques effets au texte : relief, bordure...
Définit le nom de la police de caractères.
⚠
Permet d'exploiter les fonctionnalités spécifiques des polices de caractères OTF, WOFF, etc.
Ajustement du crénage entre caractères.
⚠
Définit le langage à prendre en compte lors du choix des caractères.
⚠
Optimise la forme des caractères en fonction de leur taille.
Définit la palette de couleurs utilisable pour les polices de caractères colorées.
Ajuste la taille des caractères.
Définition du coefficient d'aspect de la police.
Modifie l'étirement ou la compression des caractères.
Sélectionne les styles italique ou oblique de la police de caractères.
⚠
Autorise ou non le calcul des styles manquants dans la police de caractères.
⚠
Autorise ou non le navigateur à synthétiser les caractères en exposant ou en indice.
⚠
Autorise ou non le navigateur à calculer le glyphes des caractères en petites capitales.
⚠
Définit si le navigateur est autorisé à synthétiser les formes italiques des caractères.
Raccourci permettant de définir les attributs typographiques évolués : ligatures, substitution de caractères, etc.
Définit la substitution de caractères (polices OTF, WOFF).
Applique une capitalisation des caractères.
Typographie spécifique aux caractères chinois ou japonais.
⚠
Choisit entre une présentation en emoji ou en texte.
Active ou désactive la ligature des caractères.
Définit le mode d'affichage des nombres évolués : fractions, numéros, etc.
Mise en exposant ou en indice des caractères.
⚠
Donne accès aux possibilités stylistiques des polices OTF
Sélectionne une graisse pour les caractères.
Synonmye de font-stretch (largeur/élargissement des caractères).

Directives.

Définit tous les paramètres d'une police de caractères téléchargeable.
⚠
Définit les variantes typographiques à utiliser.
Définit une palette de couleurs appliable ensuite à une police de caractères.