Browse all DESIGN.md examples

Typography Systems

Browse DESIGN.md examples that emphasize typography systems, type scale, font pairing, and hierarchy as reusable implementation guidance.

151 curated examples24 per pagePage 6 of 7

What To Study

Compare how these systems define display type, body fonts, scale jumps, density, and readability rules instead of leaving typography as vague visual taste.

What To Compare

Focus on font roles, scale naming, line-height intent, responsive hierarchy, and whether the system makes typography easy for engineers and AI tools to apply consistently.

Design Analysis

Common typography systems signals

--- version: alpha name: "Ledger Artifact Minimalism" description: "A sparse archival portfolio language built from white voids, thin rules, barcode-like utility detail, and restrained dark artifact imagery." colors: pri... --- version: alpha name: "Gallery St...

Recurring System Signals

  • Build the experience as an index, dossier, or ledger rather than a promotional portfolio.
  • Let whitespace do most of the talking.
  • Use thin rules, utility stamps, and microtype to organize information with extreme restraint.
  • Use sparse archival imagery, muted product stills, and occasional dark slabs to punctuate the page.
  • Keep every image isolated and surrounded by substantial white space.
  • Let visual artifacts feel collected, documented, or filed rather than marketed.

Related Keywords

OverviewImage DirectionColorsTypographyLet whitespace do most of the talkingBuild the experience like a quiet exhibition catalogLayout

Aaron Sananes

Home

2026-01-06

--- version: alpha name: "Ledger Artifact Minimalism" description: "A sparse archival portfolio language built from white voids, thin rules, barcode-like utility detail, and restrained dark artifact imagery." colors: pri...

  • Build the experience as an index, dossier, or ledger rather than a promotional portfolio.
  • Let whitespace do most of the talking.
Open example

Endless

Home

2026-01-06

--- version: alpha name: "Gallery Strip Minimalism" description: "A quiet studio portfolio language built from a narrow information rail, a long vertical gallery strip, and almost no decorative chrome." colors: primary:...

  • Build the experience like a quiet exhibition catalog.
  • Use a narrow left rail for metadata, navigation, and lightweight framing.
Open example

Refined

Home

2026-01-06

--- version: alpha name: "Desk Artifact Launchpad" description: "A bright launch-page language built from a central bold message, softly textured paper ground, floating desk artifacts, and rounded utility cards." colors:...

  • Build the experience like a launch message dropped onto a real desk.
  • Keep one bold headline at the center and let smaller utility artifacts orbit around it.
Open example

Typography Systems FAQ

What should I study on this page?

Compare how these systems define display type, body fonts, scale jumps, density, and readability rules instead of leaving typography as vague visual taste.

Why browse this as a dedicated DESIGN.md collection?

A focused collection makes it easier to compare how teams describe one system concern consistently across many examples instead of mixing unrelated signals on a single page.