Type-setting in CSS: Using typography to enhance your design
summary
Practical CSS techniques for readable, polished type: choose fonts from Google Fonts or host them (import, link, or bundle assets), load only needed weights (font-weight 400 normal, 700 bold; avoid <300 unless you include the file), and prefer unitless line heights like line-height: 1.75 so spacing scales. Use max-width: 54ch (39–54 characters ideal) for line length, numeric font-variant changes (lining vs oldstyle), ligatures control, ::first-letter/::first-line for drop caps, text-decoration options, and shape-outside + clip-path to wrap text around images; variable fonts exist but remain scarce.
AI-written summary · about
chapters (6)
related talks
01h 18mType Is Design:Fix Your UI with Better Typography and CSS
37mResponsive Typography Techniques
47mYou Can Save Web Typography- 47mYou can save Web Typography
01h 03mFonts, Form and Function: A Primer on Digital Typography
20mDynamic Typographic Systems with Variable Fonts
45mTypography and accessibility
42mTypography for Frontends