Components

Utilities

Fonts

Showcase

Donations

Login

Sign up

Github

Discord

Add a font

To display it perfectly, we need to know the metrics of your font. They are 5 values we need:

--units-per-em

--font-cap-size

--ascent

--descent

--line-gap

Those values will be given to you when converting your font.

Now you just need to add those variables to the selector of your choice, plus a variable named font-family containing the name of your font as such:

If a text tag doesn't have a designed font, Nimbus CSS will give it the Arial font.

To unable this behaviour, use the no-metrics utility.