font-variant
A shorthand property that lets you control advanced typographic features like small caps, old-style numerals, and special ligatures. It helps you make text look more professional and polished if the font supports it.
It is documented as part of the CSS Fonts specification.
Syntax
/* Usage Example */
.fancy-header {
font-variant: small-caps;
/* turns lowercase letters into smaller versions of capital letters */
}
/* Syntax */
font-variant: normal;
font-variant: none;
font-variant: stylistic;
font-variant: historical-forms;
font-variant: styleset;
font-variant: character-variant;
font-variant: swash;
font-variant: ornaments;
font-variant: annotation;
font-variant: small-caps;
font-variant: all-small-caps;
font-variant: petite-caps;
font-variant: all-petite-caps;
font-variant: unicase;
font-variant: titling-caps;
font-variant: ordinal;
font-variant: slashed-zero;
font-variant: ruby;
/* Global values */
font-variant: inherit;
font-variant: initial;
font-variant: revert;
font-variant: revert-layer;
font-variant: unset;
font-variant Browser support
Widely available
Since
2015 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.
1+
1+
1+
12+