In Web & Mobile Design
What is a Baseline Grid?
A baseline grid aligns text baselines across components and columns to create consistent vertical rhythm.
When to use a Baseline Grid?
- Content-heavy layouts and reading experiences
- Design systems that demand typographic consistencyWhen not to enforce a Baseline Grid? - Highly expressive or experimental layouts prioritizing visual play over rhythmWhat is the anatomy of a Baseline Grid?
- Base unit derived from line-height
- Multiples for spacing scale
- Alignment of headings, body text, and UI controls