OpenType features

The switchable extras baked into a font file: alternate letters, small caps, fractions, special numerals, fancy ligatures.

turn on the fancy lettersthe alternate gfont feature settingsopen type featureshidden characters in a fontswashes and alternatesthe extra glyphs designers keep talking abouthow do I get the old-style numbers

See it

Live demo coming soon

What it is

An OpenType font can carry more glyphs than a keyboard can reach, plus rules for swapping them in. Those rules are features, each with a four-letter tag: 'liga' (standard ligatures), 'smcp' (small caps), 'onum' (oldstyle figures), 'tnum' (tabular figures), 'frac' (fractions), 'zero' (slashed zero), 'swsh' (swashes), and 'ss01' through 'ss20' (stylistic sets, like a single-story alternate g or a straight-legged R). Which set holds which alternate is decided by the font's designer, so 'ss01' means nothing on its own.

Prefer the readable CSS properties over the raw tags: 'font-variant-numeric: tabular-nums oldstyle-nums', 'font-variant-caps: small-caps', 'font-variant-ligatures: discretionary-ligatures'. Drop to 'font-feature-settings' only for stylistic sets and other tags with no friendly property. Do not reach for 'font-variation-settings' here: that is a different mechanism entirely, and it drives variable-font axes such as 'wght', 'wdth', and 'opsz' rather than layout features.

Two traps. First, 'font-feature-settings' is not additive: declaring it again on a child element wipes whatever the parent turned on, so write the full list every time. Second, a feature only exists if the designer drew it, and font subsetting for performance frequently strips the alternate glyphs out. Check the foundry's specimen page, then check your actual built font file, before you build a design on 'ss03'.

Ask AI for it

Turn on the OpenType features this typeface ships. Use the high-level CSS properties: 'font-variant-numeric: tabular-nums slashed-zero' on tables and stat blocks, 'font-variant-caps: all-small-caps' on the acronyms, and 'font-variant-numeric: diagonal-fractions' where fractions appear. For the alternate single-story g, first inspect this font's specimen or its GSUB table to find which stylistic set actually contains that glyph, since 'ss01' through 'ss20' mean different things in every font, then enable that exact tag with 'font-feature-settings' and tell me which tag you used and how you confirmed it. Repeat the full feature list on any nested rule, since the property does not merge. Confirm the font contains each tag before relying on it.

You might have meant

ligaturesmall capstabular vs proportional figuresstylistic setvariable font

Go deeper