Table of Contents


Work in progress!

Getting started

You can choose between two link types:

  1. font — includes 4 of the default font styles
    • Regular, Italic, Bold, and Bold Italic styles.
  2. font-all — includes default and extra styles for a specific font
    • Note: Some of the fonts do not have extra styles.

Quick start

Add a link to font(s) you want to use in page <head>, e.g.:

<link rel="stylesheet"

And then add this to your CSS file:

body {
    font-family: 'Inter', 'fallback fonts...', sans-serif;

Beware of case-sensitivity — font path is always lowercase.

Save bandwidth on mobile devices

By using a conditional media query, you can choose when to load custom fonts, thus making the load time faster on mobile devices.

<link rel="stylesheet"
      media="screen and (min-width: 720px)"

Font list

Fonts with WIP documentation. All available fonts.

10 out of 10 documented fonts.

Monospace family

4 Monospace fonts available.

Sans-Serif family

3 Sans-Serif fonts available.

Serif family

3 Serif fonts available.