How To Pair Fonts Like A Pro

MASTERING THE ART OF PAIRING FONTS

BUT FIRST, A BRIEF HISTORY OF TYPE...

If you’re a designer, you might cringe when people use the term “font” as an all-encompassing term. Unless you’re a typographical expert, the term “font” probably just means some sort of stylized lettering. Technically speaking, fonts are different from font families and typefaces.  “Want to know why? Keep reading!

Thankfully we have keyboards and laser printers today that make typography a breeze. But it wasn't always this easy to get your thoughts into print!

How to Pair fonts by Dapper Fox Design in Salt Lake City Utah

TYPEFACE
Look back in time, and you'll find that each page of print needed to be hand set into frames with metal letters. After the letters were laid out, ink was rolled over it and pressed onto paper. Each metal letter was a specific size and shape, which collectively made up a typeface. The term font was used to describe a specific weight, size and style (regular, italicized, etc.). This means printers had to carry thousands of different metal letters to create their prints. YIKES!

*An easy way to think of a typeface is what you SEE, but a font as what is USED.

FONT
With the use of modern computers, we have come to recognize the term font as a noun that describes the look of the type, rather than the mechanism. Honestly, it just seems outdated to differentiate between font family, fonts and typefaces anymore. If you're talking to a dedicated font specialist, you may want to use the correct terminology. However, if you're using the words in day-to-day conversations, go ahead and use the word font. Language evolves over time, and we've come to apply old words to new technology. Even designers in the newer generations are doing it.

How to Pair Fonts and put fonts together like a pro by Dapper Fox Design in Salt Lake City Utah//   Website Design - Branding - Logo Design - Entrepreneur Blog and Resource
 

3 GUIDELINES TO BETTER FONT COMBINATIONS

1. FONT TYPES

First, it’s important we understand that fonts are divided into 3 common categories: Serif, Sans Serif, and Script (sometimes called cursive).

If you’re not familiar with the terms, “sans” or “serif”, let me explain. Think about the classic font, Times New Roman for a second. You know those little blocks at the tips of the letters?

What is a serif by Dapper Fox Design in Salt Lake City Utah

These are called “serifs”. Serifs come in all shapes and sizes ranging from slabs (think chunky and blocky) to hair (teeny tiny little wisps) and everywhere in between.

If we look up the term “sans” in the dictionary, we find that the term is latin in root, and means “without”. So the term “sans serif” simply means that the font is missing any serifs. Easy, right? Here you can see the font, Arial, used in the demonstration to show the plain tips without any serifs.

what is a serif on a font by Dapper Fox Design in Salt Lake City Utah

Script or cursive fonts are fairly obvious. You can easily identify this category when you see type that is created from handwriting and has strokes that are varied and fluid.

2. FONT VARIETY

I typically recommend choosing no more than 3 fonts per project. If you go overboard with different fonts, your final product can end up a jumbled mess. Since nobody wants that, try to keep your font selection to a minimum of 3 different fonts. 

3. FONT PAIRINGS

Now that we understand what each of these broad categories of fonts actually means, let me show you an easy trick to pair like a pro.

We have two options when pairing fonts:

  1. Pair different font families
  2. Use weighted text to create visual contrast between two fonts in the same family.
     

TO PAIR FONTS IN DIFFERENT FONT FAMILIES:

Choose a font from any of the three categories: serif, sans serif or script. To pair your chosen font, simply pick another font from any other category EXCEPT the one you just chose. Voila! It can be that easy.

There are a few more tips to creating that perfect font combination.

  1. Determine the weight of your primary font. If you’ve chosen a heavier weighted font, opt for a complimentary, thinner font. The contrast of the two will create visual interest for the viewer, and will look oh-so-much better!
     
  2. Pairing narrow fonts with round typefaces create less dramatic but still professional combos.
     
  3. Try increasing the spacing on your title text (not recommended for body text). Giving the fonts rooms to breathe can create a simple change to the overall appearance.
     

TO PAIR FONTS IN THE SAME FONT FAMILY:

Choose a serif or sans serif font that you’ll want to use for your document. Make sure the font you’ve chosen has the option of at least 2 font weights or variations. You can use any combo that has contrast. From extra heavy bold weight paired with light, or regular weight with italic. Just remember that contrast is key!

But what about scripts or cursive? I recommend staying away from pairing this category of fonts together in different weights. Cursive should only be used for titles, and not for the body of the text.

WHERE TO FIND FREE FONTS

You understand how to use fonts now, but where do you find them? There are millions (hmmm, maybe thousands?) of free fonts out there. Some are quality, amazing fonts, while others have serious issues. Be wary of just any free font. Kerning can be a problem, and usage licenses may not cover commercial applications.

As a safe bet, I love Google Fonts, as well as Fontsquirrel.com. Both offer higher-quality free fonts that are approved for commercial use. If you’re looking to spend money on a solid, quality font family, I loooove creativemarket.com. I could spend hours drooling over their font collections.

 
google font pairings how to pair fonts by Dapper Fox Design in Salt Lake City Utah//   Website Design - Branding - Logo Design - Entrepreneur Blog and Resource