Why Spleen uses five fonts

Five fonts live in Spleen. Together they keep the interface quiet and give every writer a page that feels right.

The interface should stay quiet

A writing app has a strange job. It needs enough character to feel like a place you want to return to, but it cannot keep asking for your attention while you are trying to hear a sentence.

Inter does most of the everyday work in Spleen. It is used for buttons, menus, settings, and all the other small things that help you move around. It is clear without making every label feel important.

Cormorant Garamond is there when a little more character is welcome. It is used for headings and the Spleen wordmark. In small amounts it gives the app something warm and bookish. If it were used everywhere, it would quickly become too much.

The page needs its own voice

The editor is different from the rest of the app. I did not want the writing to feel like text inside a form. It should feel closer to a page.

Literata is the default font for that page. It has a calm rhythm and remains comfortable when a document gets long. The words feel separate from the interface around them, which makes it easier to settle into the work.

That will not suit everyone. You can choose Inter for a cleaner page, or Atkinson Hyperlegible when you want letters to be easier to tell apart. It is your own writing preference. It changes the page you work on, not the manuscript or anything you export.

A font for the small technical things

IBM Plex Mono is used for code, version numbers, and values that need to be scanned rather than read as prose. Every character takes the same amount of space, so a row of numbers stays steady and differences are easier to spot.

It does not belong in the manuscript. That is the point. Giving it one small job keeps technical information apart from the writing.

The letter that broke the layout

Fonts bring their own surprises. Cormorant Garamond has letters with long tails below the line. The browser does not always leave quite enough room for them, especially when a title is cut off after two lines.

A project title with a g in it taught me that. The bottom of the letter disappeared. Nothing else looked wrong, and a title without one of those low letters would never show the problem. The fix was simply to leave a little more room beneath the text.

There was another quiet problem when the Inter files were made smaller for the web. The smaller files had dropped two details Spleen was still asking for: rounder quotes and commas, and a slash through zero. The page did not break. Those requests simply did nothing, and the text looked a little less careful.

That is why choosing a font is only the start. You also have to live with it for a while, write real words in it, and notice what happens to the g.