Historical Glyphs and Stylistic Sets in OpenType Fonts: A Web Developer’s Guide

Many OpenType fonts have glyphs that are ornamental in nature or intended for reproducing historical texts. There are also a large number of typefaces that provide alternate designs of accented characters for non-English languages.

Many of these are implemented as stylistic sets, which can be confusing to use because they are numbered from 01 to 20, and are frequently a hidden feature. For example, neither Google Fonts or Adobe Fonts reveal that a typeface has stylistic sets (or any of the OpenType features described in our library).

To find out if a typeface has stylistics sets, look it up in our typeface library. Any special OpenType features that provide alternate glyphs will be displayed. Also, stylistic sets can include labels in the font file. These are optional and not always provided by the type designer, but they will be displayed in the library if it is provided.

How to use historical glyphs and stylistic sets in CSS

Historical ligatures can be activated with the font-variant-ligatures property. As described in further detail in the OpenType ligatures guide, this property accepts multiple space-delimited values. This will let you, for example, select multiple ligature-related features in a typeface that supports it. (Historical ligatures are mentioned here rather than in the ligatures article because they are a rarely implemented feature that is typically used only in historical texts.)

All the other features are activated using the generic font-feature-settings property and the OpenType property name as the quoted property value followed by 1 or on. For example, if you want to use stylistic set 1, the CSS would be font-feature-settings: 'ss01' 1.

You can activate multiple features separated by commas. For example, to use both swashes and historical forms, the CSS would be font-feature-settings: 'hist' 1, 'swsh' 1.

Historical Ligatures

CSS property: font-variant-ligatures: historical-ligatures or no-historical-ligatures
OpenType property: hlig

You might find a need for historical ligatures if you are reproducing historical texts, or are simply looking for an antique look in your designs. This is a rarely implemented feature that you’ll find mostly in serif fonts.

EB Garamond has several historical ligatures that involve the long s character (which you can insert into your documents with the HTML entity ſ):

ſj ſſi ſt ſſt ſb

EB Garamond without (top) and with (bottom) historical ligatures enabled.

Note: the no-historical-ligatures is mentioned here for completeness, but it’s not needed unless you are overriding another rule in the CSS cascade. Historical ligatures are disabled by default.

List of fonts with historical ligatures

Historical Forms

CSS property: font-feature-settings: 'hist' 1
OpenType property: hist

Historical forms are a feature for displaying historical characters, such as the long s mentioned previously. These characters can be inserted into your document with HTML entities, but you might find it easier to use this CSS property to convert them from their modern analog.

Here’s an example with EB Garamond, which has the long s, long i and some Cyrillic ligatures:

J j s

EB Garamond without (top) and with (bottom) historical forms enabled.

This feature is very rare and implemented in only a handful of typefaces in the library, which reflects their niche usage. One notable example is that you’ll find the long s used in the United States Bill of Rights.

List of fonts with historical forms

Swash

CSS property: font-feature-settings: 'swsh' 1
OpenType property: swsh

Swashes are glyphs with an ornamental or calligraphic design. Work Sans has a nice set of swashes that replace several of its standard uppercase characters.

A E F L M N R S T W

Work Sans without (top) and with (bottom) swashes enabled.

List of fonts with swashes

Stylistic Sets

CSS property: font-feature-settings: 'ss01' 1 to 'ss20'
OpenType property: ss01 to ss20

Stylistic sets are a flexible way for type designers to expose a wide variety of different glyphs in OpenType typefaces. The most frequent use case for stylistic sets is to provide alternate designs for lowercase or uppercase letters, especially those that include diacritics. For example, here is stylistic set 1 (ss01) in Work Sans:

g ğ ǧ ĝ ģ ġ ḡ

Work Sans without (top) and with (bottom) stylistic set 1 (ss01) enabled.

The other common use case for stylistic sets is to provide symbols. While you can use HTML entities for this purpose, the character substitution feature of OpenType can make this easier than remembering entity numbers. A good example is EB Garamond, which substitutes entire words with symbols for rock, paper, and scissor symbols in ss02:

stone paper scissors

EB Garamond without (top) and with (bottom) stylistic set 2 (ss02) enabled.

EB Garamond also has a set to make arrows more convenient to use:

arrowright arrowrightarrowright arrowright4 arrowright/

EB Garamond without (top) and with (bottom) stylistic set 3 (ss03) enabled.

There are 20 possible slots for stylistic sets, and many typefaces implement several of them. Check out the font library under OpenType Features to view all of them.

Stylistic Alternates

CSS property: font-feature-settings: 'salt' 1
OpenType property: salt

Stylistic alternates is a feature that is usually used as a shorthand for one or more stylistic sets. For example, in Work Sans, turning on stylistic alternates is equivalent to turning on stylistic sets 01-06. In Work Sans, these sets are all thematic related, so the salt feature lets a designer use all six sets while giving them the flexibility to turn them on individually.

If we’re able to parse the OpenType data from the font file (which can be tricky), we’ll display the full list of glyphs that correspond to the stylistic alternates in a typeface.

List of fonts with stylistic alternates

May 21, 2026