OpenType features on the web

Finding out which features are supported by a font

  1. Locate your order’s HTML specimen that was shipped with your webfont download. Alternatively, you can also download the font's PDF specimen that is either available in the ”My orders” section of your client account (you must be logged in to access this), or on the font family page on our website.

  2. Open the HTML file. Under the "OpenType features" section, you will see the list of features.

Activating OpenType features in CSS

Each font is delivered with a pre-build sample CSS code. In your HTML specimen, locate the four-letter code that corresponds to the desired feature. Here's a sample that activates kerning in all fonts:

/* Activate kerning in all fonts. We recommend using this by default! */
p {
font-feature-settings:"kern" 1;
font-kerning: normal;
}

Here is another sample that combines multiple OpenType features in one line. Use it to activate simultaneously kerning, old-style + proportional figures, and the stylistic set number 1.

/* Activate kerning, old-style + proportional figures, and the stylistic set number 1 */
p {
font-feature-settings:"kern" 1, "onum" 1, "pnum" 1,"ss01" 1;
}