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

font-variant-ligatures

The font-variant-ligatures CSS property controls which ligatures and contextual forms are used in the textual content of the elements it applies to. This leads to more harmonized forms in the resulting text.

Typography

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
font-variant-ligatures
34
79
34
9.1
34
9.3
common-ligatures
31
79
34
7
31
7
contextual
31
79
34
7
31
7
discretionary-ligatures
31
79
34
7
31
7
historical-ligatures
31
79
34
7
31
7
no-common-ligatures
31
79
34
7
31
7
no-contextual
31
79
34
7
31
7
no-discretionary-ligatures
31
79
34
7
31
7
no-historical-ligatures
31
79
34
7
31
7
none
31
79
34
7
31
7
normal
31
79
34
7
31
7
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (31)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (79)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (7)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (31)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (7)

Syntax

CSS 
.elegant {
  font-variant-ligatures: common-ligatures
    discretionary-ligatures;
}
.code {
  font-variant-ligatures: none;
}

Live demo

combinecharacter with(common)

CSS combinecharacter with(common) demo.

PreviewFullscreen

combinecharacter none(none)

CSS combinecharacter none(none) demo.

PreviewFullscreen

combinecharacter(discretionary)

CSS combinecharacter(discretionary) demo.

PreviewFullscreen

Use cases

  • Using font-variant-ligatures

    The font-variant-ligatures CSS property controls which ligatures and contextual forms are used in the textual content of the elements it applies to.

Cautions

  • May not be supported in older browsers.

Accessibility

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

Related links