Spec-Zone.ru › CSS

`font-synthesis-weight` CSS property

Baseline Widely available

This feature is well established and works across many devices and browser versions. It's been available across browsers since March 2023.

The font-synthesis-weight CSS property lets you specify whether or not the browser may synthesize the bold typeface when it is missing in a font family.

It is often convenient to use the shorthand property font-synthesis to control all typeface synthesis values.

Syntax

/* Keyword values */
font-synthesis-weight: auto;
font-synthesis-weight: none;

/* Global values */
font-synthesis-weight: inherit;
font-synthesis-weight: initial;
font-synthesis-weight: revert;
font-synthesis-weight: revert-layer;
font-synthesis-weight: unset;

Values

This property is specified as one of the following keyword values:

auto
Indicates that the missing bold typeface may be synthesized by the browser if needed.
none
Indicates that the synthesis of the missing bold typeface by the browser is not allowed.

Formal definition

Initial value auto
Applies to all elements and text
Inherited yes
Computed value as specified
Animation type discrete

Formal syntax

font-synthesis-weight = 
  auto |
  none

Examples

Disabling synthesis of bold typeface

This example shows turning off synthesis of the bold typeface by the browser in the Montserrat font.

HTML

<p class="english">
  This is the default <strong>bold typeface</strong> and
  <em>oblique typeface</em>.
</p>

<p class="english no-syn">
  The <strong>bold typeface</strong> is turned off here but not the
  <em>oblique typeface</em>.
</p>

CSS

@import "https://fonts.googleapis.com/css2?family=Montserrat&display=swap";

.english {
  font-family: "Montserrat", sans-serif;
}
.no-syn {
  font-synthesis-weight: none;
}

Result

Specifications

Specification
CSS Fonts Module Level 4
# font-synthesis-weight

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Opera Safari Chrome Android Firefox for Android Opera Android Safari on iOS Samsung Internet WebView Android WebView on iOS
font-synthesis-weight
97
97
111
83
16.4
97
111
68
16.4
18.0
97
16.4
auto
97
97
111
83
16.4
97
111
68
16.4
18.0
97
16.4
none
97
97
111
83
16.4
97
111
68
16.4
18.0
97
16.4

See also

  • font-synthesis shorthand, font-synthesis-small-caps, font-synthesis-style
  • font-style, font-variant, font-weight

© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/font-synthesis-weight

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API