Invisible Work of Typography
We have been interacting with a lot more chat/text based interfaces nowadays. What intrigues me is how good typography goes unnoticed and remains invisible to readers.
When reading, we don’t really think about fonts and font attributes. Our eye naturally scrolls through each line, then to the next, and nothing interrupts the flow. However, if anything is off, you will notice immediately. Maybe the line lengths are too long, spacing is inconsistent, or the text feels cramped.
It’s very interesting to know how these small details can overhaul the reading experience.
More of our daily interactions are happening through texts and natural languages. As AI and software interfaces have largely defaulted to chat-based designs, typography becomes more important than ever, and this importance slips our minds inadvertently.
This article explores the small details that help make typography feel right, and the patterns that appear in well-designed interfaces that are often less talked about.
The principles haven't changed
Many principles of good typography are not new. Typographers long ago were solving similar problems before we started designing for screens.
I have always loved the typography in books and newspapers in particular. For example, a lot of information is stuffed into a single newspaper page; however, your eyes can easily distinguish headlines, sections and paragraphs.
If you observe carefully, you can see how different font sizes make a clear hierarchy. Columns keep lines at a comfortable length, so eyes can move easily from one line to the next. The whitespaces separate content just enough without breaking the reading rhythm. Not everything has to be big or bold to get attention. Much of the hierarchy comes from using these techniques.
An example of typography and visual hierarchy in traditional newspaper design.
These same principles apply to modern interfaces. We still rely on type size, spacing, line length, and weight to focus attention and make information easier to read.
The medium of information has changed, but the core principles remain much the same.
The small details that add up
I've spent a lot of time refining the typography on my website. I did not pick any fancy font, but by playing around with the small details — font size, line height, spacing, and line length until typography feels natural and creates a comfortable reading flow.
What I have observed is how much these minor adjustments can change the overall reading experience.
A line that is too long makes it harder to focus on the next line. Less line height makes text feel cramped, whereas line height that is too large can break the reading rhythm.
Each change by itself seems to be insignificant. But together, they make the difference between a page that feels comfortable to read and one that doesn't.
Here's a small experiment. Try adjusting the values below and see how the same text feels different without changing a single word.
Observing typography
What is good typography, and why do some websites feel better to read than others? Is it the font, colour, or the weights, or something else?
For example, let's take some well-designed websites. Stripe Press, A24, Linear, Vercel, Pentagram, Instrument and The New York Times.
I compared font sizes, line heights, letter spacing, text widths, and heading styles.
What I found was not how different they were, but how much attention went into the same small decisions.
Here’s some of what I have found:
Despite their different fonts, sizes, and styles, a few common patterns stood out:
Smaller text needs more room
Smaller body text generally needs more line height, while larger headings can sit closer together. Across the sites I studied, body text used line-height ratios of around 1.3–1.7, while some large headings went below 1.
Letter spacing follows a similar pattern: tighter for large text, looser for small uppercase labels. Line length also depends on purpose, with editorial pages favouring shorter lines and documentation often running wider.
Subtle differences create tone
Body text rarely uses pure black or white. Instead, many sites use off-black, navy, or softened whites, giving a warm touch.
Font weights are equally subtle. Rather than jumping between regular and bold, some use intermediate weights like 420, 510, or 590 to create a quieter hierarchy.
Less is more
Fewer sizes, more discipline. A consistent type scale, thoughtful whitespace, and clear relationships between headings and paragraphs can establish hierarchy without adding more visual elements.
Even the space around headings matters. More space above than below helps connect a heading to the content that follows.
The details you never notice
Some decisions are almost impossible to notice without inspecting the styles.
OpenType features refine individual characters. Relative units like rem can respect the reader's browser font-size preferences when the root size isn’t set in px. Interestingly, only half the sites I studied used this approach.
Looking back at the newspaper example in the previous section, it's interesting how these details line up and how familiar these observations feel. Different tools, different mediums, but many of the same decisions are carried forward around spacing, hierarchy, and readability.
When everything feels right
I think good typography is more about getting a set of small details right, rather than trying to find the perfect font.
The best details are often invisible. They don't ask for attention. They just make the experience feel right.
If you've read this far without noticing anything wrong with the typography, it worked.