Font pairing rules
A simple system for pairing fonts without guessing.
Font pairing rules.
Key points
- Prefer clarity over style for body text
- Use consistent sizes and spacing across components
- Pair fonts by contrast: shape, x-height, and weight range
- Load only what you use to keep pages fast
Quick checklist
- Keep roles clear: headings vs body
- Start with 2 weights
- Test at small sizes