font-variant-alternates
A property that lets you toggle stylistic alternates in a font (like different ways to draw the letter 'g' or 'a') if the font has multiple versions of those characters.
It is documented as part of the CSS Fonts specification.
Syntax
/* Usage Example */
.fancy-g {
/* Uses historical alternates for a vintage feel */
font-variant-alternates: historical-forms;
}
/* Syntax */
font-variant-alternates: normal;
font-variant-alternates: stylistic;
font-variant-alternates: historical-forms;
font-variant-alternates: styleset;
font-variant-alternates: character-variant;
font-variant-alternates: swash;
font-variant-alternates: ornaments;
font-variant-alternates: annotation;
/* Global values */
font-variant-alternates: inherit;
font-variant-alternates: initial;
font-variant-alternates: revert;
font-variant-alternates: revert-layer;
font-variant-alternates: unset;
font-variant-alternates Browser support
Widely available
Since
2023 92% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2023.
111+
34+
9.1+
111+