Web Typography

Readable, hierarchically structured, and performant text design for the web.

Scope

Use this skill when: You are selecting fonts, defining font pairings, building typographic scales, setting line heights and line lengths, implementing fluid typography, or auditing existing typography for quality.

Principles

1. Typography Is User Interface

Text is the primary information layer. Typographic design determines whether content is read, scanned, or ignored.

2. Readability Before Aesthetics

A font must first be readable. If the user focuses on the formatting instead of the content, the typography has failed.

3. Create Hierarchy Through Typography

Different sizes, weights, and styles form a clear information hierarchy. The reading flow is typographically directed.