Widely availableSupported across all major browsers. Safe to use in production.
Typography Widely available

font-synthesis-style

The font-synthesis-style CSS property sets whether or not the browser should synthesize italic and oblique typefaces when they're missing from the font.

Typography

Overview

The font-synthesis-style CSS property sets whether or not the browser should synthesize italic and oblique typefaces when they're missing from the font.

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
font-synthesis-style
97
97
111
16.4
97
16.4
auto
97
97
111
16.4
97
16.4
none
97
97
111
16.4
97
16.4
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)

Syntax

CSS 
.japanese-text {
  font-synthesis-style: none;
}
.western-text {
  font-synthesis-style: auto;
}

Live demo

compositeitarik(auto)

CSS compositeitarik(auto) demo.

PreviewFullscreen

composite none(none)

CSS composite none(none) demo.

PreviewFullscreen

Apply with Japanese.

Apply demo. with CSS Japanese.

PreviewFullscreen

Use cases

  • Using font-synthesis-style

    The font-synthesis-style CSS property sets whether or not the browser should synthesize italic and oblique typefaces when they're missing from the font.

Cautions

  • May not be supported in older browsers.

Accessibility

  • Make sure visual changes are conveyed appropriately to assistive technology.

Related links

Powered by web-features