mona-sans v1.0.0

Mona Sans

Download Mona Sans • Typeface microsite ↗️

A strong and versatile typeface, designed together with Degarism and inspired by industrial-era grotesques. Mona Sans works well across product, web, and print. Made to work well together with Mona Sans's sidekick, Hubot Sans.

Mona Sans is a variable font. Variable fonts enable different variations of a typeface to be incorporated into one single file, and are supported by all major browsers, allowing for performance benefits and granular design control of the typeface's weight, width, and slant.

Usage

For web, we recommend using Mona Sans.woff2. Define the font with a @font-face rule, set its weight and stretch ranges, and use it:

@font-face {
  font-family: 'Mona Sans';
  src:
    url('Mona-Sans.woff2') format('woff2 supports variations'),
    url('Mona-Sans.woff2') format('woff2-variations');
  font-weight: 200 900;
  font-stretch: 75% 125%;
}

html {
  font-family: 'Mona Sans';
}

To reduce CLS, you can preload the font in the head of your document:

<link rel="preload" href="Mona-Sans.woff2" as="font" type="font/woff2" crossorigin>

Styles

License

Mona Sans is licensed under the SIL Open Font License v1.1.