Skip to main content
UI/UX foundations critical

Typography Best Practices

Font selection, sizing, line height, and text styling guidelines based on WCAG 2.2, Apple HIG, Material Design 3, and web typography research.

Difficulty
beginner
Read time
1 min read
Version
v1.0.0
Confidence
established
Last updated

Quick Reference

Use system-ui font stack for performance. Body text minimum 16px (1rem), line-height 1.5, max-width 65ch. Support WCAG 1.4.12 text spacing: line-height 1.5x, paragraph spacing 2x, letter-spacing 0.12em, word-spacing 0.16em.

Use When

  • Setting up typography for a new project
  • Choosing fonts for a website or app
  • Configuring text sizes and line heights
  • Improving text readability
  • Making typography accessible

Skip When

  • Working on print design
  • Building a design tool with custom font rendering

Typography Best Practices

Font selection, sizing, line height, and text styling guidelines based on WCAG 2.2, Apple HIG, Material Design 3, and web typography research.

Tags

typography fonts accessibility wcag readability

Discussion