Skip to content
All writing
03Design·January 14, 2026·6 min

Treating typography like structural engineering — load-bearing headlines, negative space as material, and rhythm as a system.

Before color, before motion, before the clever interaction — typography decides whether a page feels expensive or improvised. I think of type the way an architect thinks of structure. Headlines carry load. Body text distributes it. Negative space is not empty; it is a material that keeps the composition from collapsing.

On this portfolio, Fraunces does the structural work of display. Geist handles the human reading. Mono marks the technical metadata. Three voices, one building. When those roles blur, hierarchy dissolves and everything starts shouting at the same volume.

Scale is a decision, not a decoration

Fluid type — clamp-based sizes that grow with the viewport — lets a headline feel monumental on a wide display without becoming a liability on mobile. The goal is not maximum size. It is a clear ratio between title, support, and UI chrome so the eye always knows where to land.

I pair that with restraint in color: bone on near-black, muted for secondary, a single champagne accent for emphasis. When type and color agree, you need fewer boxes, borders, and badges to explain the page.

If removing a border, card, or label does not hurt understanding, it should not have been there.

Rhythm you can feel while scrolling

  • One job per section: one headline, one supporting sentence, one primary action when needed.
  • Keep reading measure comfortable — long lines look editorial until they exhaust the reader.
  • Use hairlines and spacing to separate ideas before reaching for cards.
  • Let display type be rare. If everything is huge, nothing is.
  • Test hierarchy in grayscale. If it still works, color will amplify it instead of rescuing it.

Typography as product thinking

Good type systems scale with the product. A case study, a journal post, a contact block — they should feel like rooms in the same house. That consistency is what makes a portfolio memorable after someone has seen a hundred others.

Build the structure first. The flourishes, if they arrive at all, should hang from something strong.

Written by

Youssef Aboulkaram

Frontend Engineer