Find typeface combinations that actually work together. Font Pair lets you preview a heading and body font side by side in a real layout, fine-tune their size, weight, and spacing, pull from the entire Google Fonts library, then copy the CSS straight into your project.
1
Pick your fonts. Use the Heading and Body dropdowns — search by name or filter by style (sans, serif, display, script, mono).
2
Shuffle for ideas. Hit Shuffle for hand-picked pairings, or turn on Surprise me to go fully random across the whole library.
3
Lock what you like. Toggle the lock on either font to keep it fixed while you shuffle the other.
4
Fine-tune. Adjust size, weight, and line-height for each font until it feels right.
5
Preview live. Click any text in the specimen to edit it and see your own copy in the pairing.
6
Export. Hit CSS to copy ready-to-use code (font import + styles) for your site.
Font Pair Pro
Save unlimited favorite pairings and upload your own custom fonts.
Heading
Size 52px
Weight
Line height 1.10
Body
Size 17px
Weight
Line height 1.65
Skip curated pairings — shuffle picks any two fonts at random
Typography Specimen
Design is intelligence made visible
A good type pairing creates contrast without conflict — one voice for headlines, another for the words people actually read.
Pairing with purpose
The quick brown fox jumps over the lazy dog. Pack my box with five dozen liquor jugs. How vexingly quick daft zebras jump! Typography is the craft of endowing human language with a durable visual form.
Get started
Click any text to edit the preview
Heading
—
Body
—