OpenType fonts

Using CSS you can unlock some advanced features of OpenType Fonts.


Switch between common / standard ligatures

Common ligatures

fi fl

font-variant-ligatures: common-ligatures;
-moz-font-feature-settings: "liga", "clig";
-webkit-font-feature-settings: "liga", "clig";
font-feature-settings: "liga", "clig";

Standard ligatures

fi fl

font-variant-ligatures: no-common-ligatures;
-moz-font-feature-settings: "liga" 0, "clig" 0;
-webkit-font-feature-settings: "liga" 0, "clig" 0;
font-feature-settings: "liga" 0, "clig" 0;

Switch between stylistic alternatives

Alternatives on

Today you will see

-moz-font-feature-settings: "salt" 1;
-webkit-font-feature-settings: "salt" 1;
font-feature-settings: "salt" 1;

Alternatives off

Today you will see

-moz-font-feature-settings: "salt" 0;
-webkit-font-feature-settings: "salt" 0;
font-feature-settings: "salt" 0;

Fractions (supported fonts only)

Convert numbers separated by a slash as fractions.

1 1/3 cup of flour, cook for 1/2 hour

font-variant-numeric: diagonal-fractions;
-moz-font-feature-settings: "frac";
-webkit-font-feature-settings: "frac";
font-feature-settings: "frac";

Hey, smarty!

Login or signup to get started

What's your name?

What's your password? Lost Password
We sent a link to reset your password to your email.
Create a new password
Upload file