There is a moment when you land on a well-designed article page and just start reading. You do not think about the design. You do not notice the fonts. You just read.
That moment is not an accident. It is the result of dozens of small decisions that editorial designers get right and product designers mostly ignore.
Product design is about actions. Click this. Fill that. Go here. Editorial design is about reading. The primary interface is text, and the designer's job is to make that text effortless to consume.
What makes editorial design different
In product design, typography is usually supporting cast. Buttons are the stars. Forms are the stars. Navigation is the star. Type just labels things.
In editorial design, typography is the whole show. There are no buttons to design around. No onboarding flows. No modals. Just a column of text and the question: how do we make this pleasant to read at 11pm on a phone?
That constraint produces very specific decisions. Column width matters because lines that are too long force eye tracking errors. Line height matters because tight leading makes dense paragraphs feel claustrophobic. Type size matters because 14px body text on a phone makes readers squint and leave. None of these are aesthetic choices. They are functional choices that happen to produce aesthetic results.
Five editorial systems, broken down
Type scale as architecture
The Verge uses extreme contrast in their type scale to create visual hierarchy that works even without images. Display headlines push 64px or larger. Body text sits in a comfortable 18px at a line height that lets copy breathe. The contrast between the two is so dramatic it forces the eye to follow the right path every time.
Bold serif paired with tight tracking
Wired's design has always argued that editorial credibility comes from typographic confidence. Their magazine DNA shows up on screen as heavily tracked serif display type paired with clean sans-serif body. The contrast between the two weights and styles creates visual tension that feels intelligent and intentional.
Typography as the entire product
Ghost made a deliberate choice to compete on reading experience rather than feature list. Their default themes push line height to 1.8, column width to a careful 680px, and let fonts do all the visual work. No decorative elements. No gradients. The bet is that if you make reading feel good, writers and readers both stay.
Newsletter DNA translated to web
Substack's design is deliberately plain, and that is the strategy. When every newsletter looks the same, writer voice stands out instead of design flair. Their constrained typographic system forces writers to rely on writing quality rather than visual gimmicks. Clean, restrained, and sticky because of it.
Editorial flexibility with consistent structure
Beehiiv gives publishers more visual latitude than Substack but still anchors everything in clean typographic structure. Their platform shows what happens when you add controlled color options and image handling to a fundamentally text-first system. The result is editorial design that scales from minimal to rich without breaking.
The three numbers that determine reading experience
If you take nothing else from this piece, take these:
When editorial works for non-media products
The SaaS world underuses editorial design. If your product involves reading, you should be thinking about this.
- +Newsletters and blogs (the obvious ones)
- +Personal sites and portfolios where writing is the primary content
- +Knowledge tools, wikis, and internal documentation
- +Email products where reading in a focused state is the core behavior
- +Long-form landing pages where the argument needs to land before the CTA
The signal is simple: if users read more than they click, you probably have an editorial design problem. Solve the reading experience first.
Browse editorial design systems
The full collection of editorial DESIGN.md files. Copy any of them into your project and tell your AI to build for reading.
Browse all designs