Home Design Font Pairing for Beginners: A Simplified Guide

Font Pairing for Beginners: A Simplified Guide

by Sandra Iakovleva

font pairing for beginners

The first rule of font pairing is that you should use no more than 3 fonts together. That’s a really useful fact, but choosing even 2 fonts that complement each other can be a headache! You can have these two gorgeous fonts, but you put them together and find your creation cringe worthy. We’ve all been there.

Today’s guide is for those that want to experiment with Crello. The library of templates already has pre-set font pairings but if you want to create a design from scratch, you’re going to need a little bit of background knowledge. This guide will give you a boost of confidence, some fancy new terms and the blessing to go off pairing fonts like a pro.

Basic vocab to get you started

Contrast

When speaking about contrast with fonts, what is implied is the contrast of elements such as form, weight, style, size, and color. When pairing fonts, you’re aiming for visual balance with the right contrast.

contrast with fonts

Concord

Two fonts that have similar traits are concord. Finding concordant fonts is much easier than you think, they usually come from the same family.

concordant fonts

Serif

Serif fonts have a small line attached to the ends of strokes. They’re a popular choice for print materials as they are easier to read.

serif fonts

Sans serif

Types of font without serifs. Interestingly, sans serif fonts are said to be harder to read. For this reason, they’re used for shorter lines of text like headlines and captions.

sans serif font

Slab serif

A typeface that is more block-like serif font. It’s considered an aggressive font so use it sparingly.

slab serif font

Decorative

Decorative fonts are a little more artistic. This is the family of fonts that are used to set the mood depending on the message. It’s great for packaging and posters.

decorative font

Script

This is a font type that is closer to cursive. It’s a difficult font to read when used for body text but works well when you have illustrations or a short title.

script font

It’s important to get these basics down because you will start recognizing the different types of fonts and what differentiates families of fonts. The reason why you have to be careful with pairing fonts is that fonts have personalities. If you glance at the list of fonts above, you can probably tell that a decorative font will not work with script fonts. And you’re right! But let’s keep investigating to find out why.

The main goal to keep in mind as you’re trying to see if the fonts work together is unity and coherence. This can be in the form of dramatic contrast (that works) or simply fonts that go well together because they’re from the same family.

As for the number of fonts, you should aim for no more than 3 as we’ve mentioned. The more fonts you have, the more challenging it will be to achieve harmony. If you’re just starting with font pairing, try different variants of fonts from the same family that have different weights.

2 important questions to ask

  1. The first question you should think about is ‘what is the nature of your content?’ You have to consider what layout you’re working with and toward what purpose or goal. You have to establish these goals to keep the purpose of your fonts clear.
  2. The second question you’re probably thinking of is ‘how do I achieve perfect font pairing?’ Successful font pairing can be achieved through concordance or contrast (which you’re now familiar with). If fonts share certain qualities (concord), chances are they will work well together. Being completely different (contrast) is another way to make fonts work together.

What you want to avoid is conflict between fonts. This can be fonts that are so different they don’t belong on the same layout or fonts that are way too similar to make a difference.

9 perfect font pairings from Crello

1. Montserrat-Bold and Yellowtail-Regular

Montserrat Bold and Yellowtail Regular

2. AbrilFatface-Regular, Montserrat-Regular and Montserrat-Bold

AbrilFatface Regular, Montserrat Regular and Montserrat Bold

3. PoiretOne-Regular and Bebasneue Regular

4. Raleway-Regular and OpenSans-Bold

Raleway Regular and OpenSans Bold

5. Offside-Regular, Superfclarendon Regular and OpenSans-Bold

Offside Regular, Superfclarendon Regular and OpenSans Bold

6. OpenSans-Bold and NoticiaText-Bold

OpenSans Bold and NoticiaText Bold

7. OleoScript-Regular and Marion-Regular

OleoScript Regular and Marion Regular

8. Righteous-Regular, Montserrat-Bold and VarelaRound-Regular

Righteous Regular, Montserrat Bold and VarelaRound Regular

9. Jura-Regular and Lalezar-Regular

Jura Regular and Lalezar Regular

3 tools for font pairing

Font Pair

This is a website that makes it easier to pair together Google fonts. You can sort the fonts by typeface combinations or simply search by font. The great thing about this website is that you can customise the text on the website to see if it will look good with the font pairings.

Typ.io

This is a great resource to turn to for inspiration. The website gathers successful font pairings from around the web to help you make decisions about your text. You can also contribute to the collection by downloading an extension.

Typespiration

The library of fonts on Typespiration is laid out as tiles which makes it really convenient to look through. On top of fonts, you also get color combinations that work well. The website also offers HTML/CSS code.

You’re now equipped with some basic vocabulary, great examples from ready-to-use templates from Crello and some of the most current tools you can use for font pairing. As you can tell, you can just explore the ready templates and see what fonts have been paired by Crello’s designers. Sometimes you’ll find inspiration in the most unexpected places.

To stay updated, read our blog post and dive deep into graphic design trends.

Related Posts