Introducing Crooli Sans, Our Open-Source Typeface

Crooli has its own typeface. It is called Crooli Sans, it is free for anyone to use, and as of today it sets every word on this site.


You can try it, explore every character and download it on [the Crooli Sans page](/font). The fonts, the build script and the full history are on GitHub.

Why a typeface of our own

When we [redesigned the site](/news/a-new-look-for-crooli) earlier this month, we set headlines in Fraunces and everything else in Instrument Sans. Both are lovely, and both belong to someone else. Crooli makes apps, tools and sites, and the words in them should sound like us wherever they appear.

A typeface is also a product. Ours had to be something we would happily give away, so it had to be open from the first day.

Built on Geist

We did not draw Crooli Sans from scratch. It starts from Geist, the open-source family that Basement.studio designed for Vercel. Geist is clear at small sizes, confident at large ones and released under the SIL Open Font License, which allows exactly this kind of fork.

Geist already contains more than one version of some letters, kept in stylistic sets that you switch on in code. We chose four of those alternates and made them the defaults:

• A single-storey a. One round bowl and a stem. It is quieter in running text and gives every word a softer edge.
• An R with a diagonal leg. It steps forward instead of standing straight.
• A G without the spur. The bar turns in and stops. Fewer corners, cleaner headlines.
• Round dots. Full stops, colons, the dots on i and j and every dotted accent are circles instead of squares.

Every outline is Geist's own drawing. We did not stretch, slant or redraw anything. The swap is done at the level of whole shapes, so each letter keeps its own spacing, kerning, accent positions and weight variations. Accented letters such as á and ġ follow automatically.

The original Geist letters are still there. Switch on `ss02`, `ss04`, `ss06` or `ss08` and you get Geist's double-storey a, straight-leg R, spurred G and square dots back.

Checked, not eyeballed

A fork like this is easy to get subtly wrong. Move one shape without its kerning and a few letter pairs start to collide. Forget the accented letters and á sits slightly off its base.

So the project includes a test. It sets text in several languages, including Vietnamese, Turkish, Polish and Russian, both with precomposed accents and with separate combining marks. It then checks that Crooli Sans lays it out exactly as Geist does with those four stylistic sets on: the same outlines, the same advances, the same kerning, the same mark positions. It runs against all eighteen static styles and against the variable fonts at six weights. Every font file also passes the OpenType Sanitizer, the same check browsers run before they use a web font.

What you get

• Nine weights, from Thin 100 to Black 900, each with a true italic.
• Variable fonts for roman and italic, so every weight in between is available.
• 728 characters covering Latin, including Vietnamese and Central European languages, and Cyrillic.
• Tabular figures, fractions, superiors, a slashed zero, case-sensitive punctuation and alternate arrows.
• Desktop fonts as TTF, and web fonts as WOFF2.

Use it for anything

Crooli Sans is released under the SIL Open Font License 1.1, the same licence as Geist. Use it in apps, websites, print and products, commercial or not. Change it and share your changes. The one thing you can't do is sell the font files on their own.

To use it on the web, copy the two variable WOFF2 files into your site and add a couple of `@font-face` rules. The [Crooli Sans page](/font) has the snippet ready to copy.

Thank you to Basement.studio and Vercel for making Geist open. Crooli Sans would not exist without it.