Typography Tester
FONT FAMILY
⌕
PREVIEW — click to edit
Design is the soul of a digitally manufactured product.
Transform
Size
16px
Weight400
Line height 1.5
Spacing 0.00em
HIERARCHY — current scale sizes
GLYPH SAMPLES
TYPE SCALE
RATIO
BASE 16px
SUGGESTED PAIRS
CREATE PAIR
HEADING
BODY
Typography Tester
Before you commit to a typeface, you want to know: is it readable, and does it look right in my colours? The Typography Tester lets you preview any Google or system font with full control, on your own colour combinations.
How to use it
- Choose a Google Font or a system font.
- Set the size, weight, line height and letter spacing.
- Type your own sample text to judge it in context.
- Set the text and background colours to preview it exactly as it will appear.
Good to know
- Readability is colour and type together — a font that is fine in black can fail in a low-contrast colour.
- Test your real content (names, numbers, long words), not just "lorem ipsum".
Related: verify the colour pair in the Contrast Checker and preview the whole system on components in UI.