Fonts & Text in CSS
From the CSS cheat sheet · Typography · verified Jul 2026
Fonts & Text
Font properties, text alignment, spacing, and web font loading
css
body {
font-family: system-ui, -apple-system, sans-serif;
font-size: 16px;
line-height: 1.6;
color: #333;
}
h1 { font-size: 2.5rem; font-weight: 700; }
.muted { color: #6b7280; }
.center { text-align: center; }💡 Use rem for font sizes (relative to root) — predictable and accessible when users change browser defaults
⚡ clamp(min, preferred, max) makes fluid typography easy — no media queries needed
📌 font-display: swap prevents invisible text while web fonts load (FOUT over FOIT)
🟢 text-wrap: balance evens out heading line lengths — great for narrow containers
typographyfontstext