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.

/* 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;
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+
Kinsta

Your first month is free

Managed WordPress hosting for faster sites.

Learn more

New CSS drops.

Join 600+ readers who've survived clearfix hacks.

ESC