Typography in product UI is a readability problem first. Size, weight, line length, and contrast decide whether a dashboard or a form can be scanned under time pressure.
Topic
Typography
Type scales, readability, pairing, and typography decisions for product UI.
UI Coach guides
Start here
Typography for UI Design
UI typography that people can scan: scale, line length, weight, and the difference between product type and poster type.
Read the guide
From the community
Latest articles
Material Design · Sep 1, 2020
Designing a Material Theme: Typography
Tailoring your typography with Material Design and Figma
Lyft Design · Namika Varma-Chang · Jun 11, 2026
The History of Typography: How the Past Shapes the Systems We Design Today
While expanding my typography knowledge, what stood out to me was how little of it is actually new. When I started studying typography more deeply as part of Lyft’s rebrand work, I expected to dive straight into learning modern best practices like accessibility guidelines, responsive type scales, and variable fonts. I.

Material Design · Feb 12, 2024
Making it easier to get Google Fonts
Website and API updates are making it simpler to get fonts and use them in your project
Manuel Matuzovic · Nov 1, 2022
Day 27: the font-variation-settings property
Adjustable features of a variable font are called axes. You can use the font-variations-settings property to change these features by specifying the four letter axis name along with a value. @font-face { font-family: 'Saira'; font-style: normal; font-weight: 400; font-stretch: 100%; font-display: swap; src: url(/blog/.
CSS Wizardry · Feb 6, 2017
Typography for Developers
A look at the simple differences that developers and engineers can make in order to improve the quality of their typography
Brad Frost · Mar 16, 2026
Fine Specimens by Elliot Jay Stocks
A curated collection of the best in contemporary type design Elliot is back with a new typography book! Elliot Jay Stocks
Lea Verou · Jun 24, 2021
Inherit ancestor font-size, for fun and profit
If you’ve been writing CSS for any length of time, you’re probably familiar with the em unit, and possibly the other type-relative units . We are going to refer to em for the rest of this post, but anything described works for all type-relative units. As you well know, em resolves to the current font size on all prope.
CSS Wizardry · Apr 10, 2026
font-family Doesn’t Fall Back the Way You Think
A quick but important reminder that font-family declarations don’t inherit fallback stacks the way many developers assume.
CSS Wizardry · Feb 21, 2016
Managing Typography on Large Apps
A look at managing typography more practically on larger sites and apps
Microsoft Design · Microsoft Design · May 29, 2025
From paper to pixels: The evolution of ClearType and onscreen reading
How we made digital text like printed words on paper By Tracy Jones Read the full article on our new website here . In the mid 1990’s, the rise of the internet tidal wave was growing high enough to kiss the sky. Cyberspace appeared like a slowly expanding phenomenon, but printing emails and web pages remained routine.
Material Design · Jun 2, 2022
You Asked for it—Here Are Some of Our Favorite Font Pairings
See our handpicked Google Fonts pairings in use, and start using them now in Figma
Material Design · Sep 1, 2020
Building a Material Theme on Android: Typography
Type theming on Android using the MDC library
Related roles
Current design jobs
161 active roles currently match UI designer in the UI Coach job catalog.
Posted 17 hours ago
Posted 20 hours ago
Posted yesterday
Posted yesterday