Font Pairing Tool
Browse curated Google Fonts combinations. Preview with your own text and grab the CSS.
Customize Preview
01/Font Pairings
CSS Code
Add the
<link> tag to your <head> and use the CSS classes in your stylesheet.About This Tool
Find the perfect font combination for your next project. All fonts are free from Google Fonts and work on every browser and device.
- 57 curated pairings — hand-picked heading + body combinations that work well together
- Live preview — see how each pairing looks with your own text
- Filter by style — serif + sans, sans + sans, display + sans, monospace combos
- Adjustable sizes — preview at different heading and body sizes
- Copy CSS — get the Google Fonts embed link and CSS rules in one click
- 100% private — everything runs in your browser, no data sent anywhere