You Asked for it—Here Are Some of Our Favorite Font Pairings
Check out the pairings and download templates on Figma!
No matter what kind of project you’re working on or where you are in the world, everyone should have access to stylish, high-quality fonts. That’s why there are over a thousand of them on Google Fonts. It's also why there are filters for language, category, and font properties to help you narrow down your options. There’s also a bunch of guidance for choosing typefaces from Google Fonts Knowledge, like “A checklist for choosing type,” by Elliot Jay Stocks.
But, you’ve been asking, “what about help with pairing fonts?”
There are millions of possible pairings on fonts.google.com! “Pairing typefaces” (also by Stocks) is a good place to start if you’re looking to gain an understanding of how good font pairs are made. Also check out his follow-up articles, “Pairing typefaces within a family & superfamily” and “Pairing typefaces by the same type designer or type foundry.”
For inspiration, check out the Google Fonts Pairings templates on Figma. The templates are open-source and you can start using them instantly in Figma.
Google Fonts: Pairings
Sehee Lee, Senior designer at Google Fonts, handpicked the nine pairings to demonstrate a variety of use cases in different contexts. All in all, it’s important for font pairings to make sense for what you’re trying to achieve, and these pairings help give you a glimpse of what’s possible. For example, for apps that need to deliver accurate information, you need fonts that are easily legible and offer various weights and styles. On the other hand, for a book cover design, you might look for more expressive fonts with interesting alternate glyphs. You may also ask questions like, “does the font support multiple languages?” or even, “what does the font make you feel?” On top of all this, a good font pairing will ensure that type is readable and harmonious at every scale.
Included with each Pairing are extra resources, such as information on the individual typefaces and links to Google Fonts Knowledge articles on typography that might be helpful.
Made with Material Design 3
Most of the digital mocks used in the templates were made from the Material 3 Design Kit (which includes a comprehensive introduction to the design system, with styles and components to help you get started) and Material Theme Builder (which helps you explore dynamic color, brand colors, and type scale).
“I am excited to have had the opportunity to incorporate Material Design resources to develop the pairings,” said Lee. “It made the template creation so easy and each individual pairing came out flexible, expressive, and unique.” Lee created the pairings by applying the baseline type scale and components. From there, she used the Material Theme Builder to create a custom palette for each pairing.
“Consider these as inspiration to start your creative project” she said. “From the nine pairs we initially set up, you can pick a suitable pair that works for your project or discover a new font that you have not had a chance to try. Perhaps, you can replace another secondary typeface on the top of the set. Use this as a baseline theme and build from there.”
Check out the pairings, download templates on Figma, and share your feedback on twitter.com/googlefonts!