You’re starting a project, and you want the design to look seamless down to the font choice.
Maybe you’ve realized already that projects created with multiple fonts can be both visually appealing and help to differentiate your designs from others’.
However, using any font pairing at random may not be the best way to go about this. Even in the design world, there can be conflict; some fonts play nicely together, while other fonts should stay in separate rooms.
Luckily, there are some guidelines that outline which fonts work well together and which don’t!
In general, fonts pair well together when there’s a significant amount of contrast between the two – but we’ll talk more about this below.
Here are 11 tips to help you combine fonts that belong together.
If you want to make font-pairing easier on yourself, this is the way to go.
Font families (serif, sans serif, cursive, fantasy, and monospace) were created as a way to classify fonts that are meant to complement each other. Sticking with fonts from the same family not only helps you narrow down your font choices but also ensures you have a cohesive look across your work.
When you’re choosing a family (any fans of The Blind Side here?), make sure to look out for one that has varying style options across fonts. Try to find a font family with a range of weights (light, bold), sizes, and cases (caps, lower, upper).
As we mentioned above, fonts pair well together when there is a certain amount of contrast between them. Here, font weight (i.e. thickness or thinness of letters) is the point of contrast; stout, chunky fonts can often work well with taller, skinnier ones.
This is because it’s easy for onlookers to distinguish between the two fonts, and understand that each plays a different role in the document or project. Both carry their weight (see what we did there?) while serving different purposes – creating a complementary design overall.
It’s also important to note that you want your font to be readable. Make sure that your font choice also takes into account font size; you don’t want to end up in a situation where your text isn’t scalable.
Kerning, in design terms, refers to the spacing between characters in a font. This is another great way to differentiate sections of your text, creating a hierarchy between fonts and showing your readers that they are looking at two distinct parts of a document.
Be creative, but don’t be too creative – a large amount of text with really loose kerning, for example, may cause a reader to lose interest, while too much tight kerning could make the text look like it’s overstuffed. Don’t be afraid to play around with the sizing of the text to help find a good balance.
Choosing font pairs that change up the spacing, on the other hand, will help balance out the piece.
While this is more of a subjective call, there is something pretty intuitive about the way fonts feel to us when we look at them. You know what reads as professional and what comes off as funky, or even just plain silly.
For example, the font you use for a child’s birthday party invitation – perhaps a rounded, bubbly typeface – is not going to have the same feeling as the one used to head a business proposal.
As you think about pairing fonts, pick ones that have similar moods – they may look somewhat different from one another, but they still go together. Try to find a font with more curves and one that’s a bit straighter but gives you the same feeling – that’s how you’ll know you did it right!
Serifs, like Times New Roman, have decorative flourishes or “feet,” at the ends of many strokes. Sans serif fonts, such as Arial, comprise a typeface whose name literally means “without feet” – i.e. without these flourishes.
Pairing serifs and sans serifs is a classic and easy way to come up with a great design contrast. When it comes to pairing text, contrast, if used appropriately, is great (just make sure that they’re not too different because that will create too much noise and is ultimately unappealing).
However, you’ll still want to make sure that the serif and sans serif pair you choose have different weights and overall styles, so that the fonts don’t come across as too similar (see Tip #9).
It is easier to pair fonts when you first assign them different categories or roles so that you can establish a sense of hierarchy between them.
Headings are usually meant to attract the most attention – often claiming the font with the largest size and the most weight. They also set the tone for your publication, as they are your readers’ first introduction to the document.
In this case, using a traditional font in your heading tells your readers they are to expect a more traditional or serious subject. Then, contrasting this with a decorative body text will create a visually appealing effect and move your readers’ eyes along.
On the other hand, this is similar in concept to the above tip, but in reverse! If you’re working on a more fun, festive or light project, a decorative heading will set that tone for your readers. The decorative heading will come off as more relaxed, and the traditional body will relay a more professional impression
Again, changing up the font between headers and body text (this could also apply to sizing and bolding) creates the type of contrast that keeps a document looking interesting.
Also, just a sub-tip: Decorative headings tend to work better with shorter headlines.
Contrast, contrast, contrast – this should generally be your focus when pairing fonts. This is one of the main reasons that serif and sans serif pair well together (see Tip #5) – the two font groups contrast.
If you’re unsure which elements you should be looking at when choosing font pairs, consider contrasting the following:
But, how do you know if your font pairs are “too similar”?
Well, if you can’t tell where one ends and one begins, you know that you’ve chosen incorrectly. Fonts that are too similar in style, weight, and size, will lose their roles in the text because the reader won’t be able to differentiate between them easily.
And, the overall effect just isn’t pleasing to the eye.
Fonts don’t need to be from the same city, but they do need to be from the same general design planet.
While contrast is certainly important (see, well, every Tip), too much difference causes discord between the two.
So how do you know which font pairs have the right amount of contrast, and which are so different from one another that they’re incompatible?
The easiest way to tell is with your naked eye – but, if you like to live by concrete rules, your best bet is to choose typefaces that have some elements in common and others that contrast. A great rule of thumb is to check the proportions and x-height (the height of the “x” character in each font). If the x-height is similar but the fonts still look different, it may be a good design choice.
Alternatively, you could pick two fonts that both have thin lettering, but differ in terms of their sizing, or choose fonts with distinct weights but similar styles.
Translation: Avoid clutter.
Limiting any work to three fonts is a general rule that many designers live by because it helps to create a balanced, cohesive design.
And, while some would argue that rules are meant to be broken, only break this rule if you see a good reason to – like a wedding invitation with several distinct parts, or for a project that’s meant to be particularly showy. But, you can always tweak the fonts you choose by making them bold, italicized, or underlined, so keep that in mind before considering adding in more than three fonts.
Take the time to think about the fonts you’re going to use together, and ask yourself why each font you’ve chosen benefits the overall design of the work. If you can’t convince yourself, you certainly won’t convince your audience!
Fonts are meant to enhance content. They make your text look visually pleasing, and ideally send some sort of message that encourages your audience to read what you have to say.
That said, if your readers can’t make out your text, they’re not going to spend a heck of a lot of time struggling to understand it.
Check how your font pairs measure up against the context in which they’re found – can you read the pair on a mobile screen? How do the fonts pair together in print? Make the appropriate tweaks so that your fonts are clear on any platform.
Now that you know how to pair fonts, it’s time to get started on your next project. If you’re looking for a new logo for your brand, check out our logo design tool!
It uses the best font pairs for your industry, and you can create cool designs in just a few clicks.