Low-hanging design fruit: why you should use Google Font Superfamilies
Here’s everything you need to know about font superfamilies to make your next design project shine
What is a font superfamily?
Are we talking about the Jacksons? The Kardashians? The Brady Bunch? Steve Martin’s fictional family in Cheaper by the Dozen? Or could we be talking about something more closely related to fonts?
Answer: WE TALKIN’ ‘BOUT FONTS, Y’ALL ⚡
A font superfamily is set of typefaces (example: merriweather and merriweather sans) that have been specifically designed to look good together. Like a musician who plays separate notes simultaneously to create one melodious chord, type designers create font families that stand out individually, but also gloriously combine to offer versatility in style and weight that makes the content on the page more visually appealing and easier to read.
Think of it this way: a superfamily has one mannequin (underlying skeleton form) that can be dressed in many different sets of clothing (serif, width, weight, size, italic). The result: pre-packaged, visually cohesive fonts that are begging to be used together for your next design project. In other words, superfamilies are big, juicy apples waiting to be picked.
Where did they come from?
The earliest evidence of superfamilies come from Roman documents all the way back in 79 AD. These Roman documents contained variations in the size of text to create a visual hierarchy. The Romans were making their title text bigger than their body text before it was cool.
Fast forward to the 1800’s, and there are typefaces being designed to be compatible across different written languages such as Latin, Greek, and Cyrillic. These were the some of the earliest prototypes of the superfamilies we know and love today.
By the 1900’s, there was an explosion of the variety of sans-serif typefaces, thus expanding the possibilities for variations across all superfamilies. During the years leading up to WWII (yes I just dropped a WWII reference in an article about typography 😂), world-renowned Dutch type designer Jan van Krimpen designed the first comprehensive set of typefaces with inherent compatibility, a project called Romulus.
In his own words, he set out “to create a complete type family, consisting of, to begin with, roman, sloped roman, semi-bold and semi-bold condensed, at least four weights of sans serif, a script type and a set of Greek characters.”
This was the most ambitious type design project to date, and while he didn’t complete it following the war, it was the beginning of what is now commonplace in type design: the superfamily.
YAWN. Okay, let’s get to the good stuff.
Here are 10 Google Font superfamilies you should know about
We’ve discussed what they are, where they come from, and why you should use them. Now let’s see some real-life superfamilies in action. Here are some great pairs from Google Fonts superfamilies to use for your next design project!
1) Quattrocento and Quattrocento Sans
Designed by Impallari Type
2) Roboto Condensed and Roboto
Designed by Christian Robertson
3) Roboto Mono and Roboto
Designed by Christian Robertson
4) PT Sans and PT Serif
Designed by ParaType
5) Oxygen Mono and Oxygen
Designed by Vernon Adams
6) Source Sans Pro and Source Serif Pro
Designed by Paul D. Hunt (Sans) and Frank Grießhammer (Serif)
7) Josefin Slab and Josefin Sans
Designed by Santiago Orozco
8) Encode Sans Semi Condensed and Encode Sans
Designed by Impallari Type
9) Alegreya and Alegreya Sans
Designed by Huerta Tipográfica (Alegreya) & Juan Pablo del Peral (Aleygra Sans)
10) Montserrat and Montserrat Alternates
Designed by Julieta Ulanovsky
Parting Words
Finding a beautiful font pair for your next project doesn’t need to be stressful, painstaking, time-consuming, or difficult. Superfamilies are DESIGNED to look beautiful together and create visual harmony for your webpage. Learn to know and love them and you’ll be a great designer in no time!
Make sure you check out Font Pair where we help you pair Google Fonts together and have some awesome font superfamily suggestions for your next project!
Extra Reading
Here are some more resources about superfamilies if you’re interested:
- Adobe Typekit Blog — Type Study: Pairing typefaces
- FontLabVideos — Font Superfamilies Lecture with Sumner Stone
- Fonts.com — Super Families
- Google — Superfamilies
- Wikipedia — Font Superfamily
- Romulus Designs by Jan van Krimpen
Thanks to Hayden and Emma for all the help with this article.
Feel free to comment below or reach out to me on Twitter!
