Pairing appropriate fonts is a great way to improve your design and introduce a little variety in it. You may want to pair 2 fonts when designing a wedding invitation card or setup fonts for a business card. It’s a challenge to figure out the right combination of fonts, though. So, first let’s look at how to pair fonts to match the latest trends. While working with pairing fonts, there are three things you should keep in mind:
Concordance is when you use a single typeface in multiple fonts on the webpage. It is the simplest way of font pairing as you only need to find one cool font that works well in different styles. So, first, you need to pick a font superfamily. Font superfamily is a typeface with multiple variations that fall into different categories. There are several classifications for a typeface. However, they are primarily divided into four categories:
Decorative: Boilerplate, Mythos STD, Rosewood
Script: Mistral, Young Baroque, Lobster
Serif: Chaparral, Minion Pro, Garamond (Subcategories: Slab, Old Style, Modern, etc.)
Sans-Serif: Proxima Nova, Helvetica, and Franklin Gothic (Subcategories: Humanist, Grotesque, etc.)
A common superfamily comprises of font families that are present in both sans-serif and serif. For example, Lucida font includes versions in Handwriting, Typewriter, Calligraphy (script), Blackletter (Gothic), and Sans Serif all in the same family. Because these font families are created to fit in the same family, they share their basic characteristics that help them work well with each other.
Contrasting refers to 2 or more different typefaces that work well together. It is challenging to pair fonts this way, but it also a more original and successful method to design a unique font pairing. The key is to look for different types that have something in common that can make them work well. Even if the fonts are entirely different, they must have one or two of these feature to become a successful pairing:
Weight: It refers to the thickness of the lines. You should always pair thick fonts with thin fonts.
X-height and glyph width: X-height refers to the height between the top and bottom of lower case letters such as “s” or “c.” Glyph width simply refers to the width of characters.
The direction of the axis: Draw an imaginary line over each letter. Different fonts will have different angles on their axis, and that will have a notable impact on how the fonts to pair together.
The shape of character: Every character changes its dimensions in different fonts. Some become small and squat while some are long and lean. Try to pair fonts that have similar shape to show uniformity.
Conflicting refers to 2 or more typefaces that are similar to each other and also work well together. It is obvious you want your fonts to have some similarities, but they should have enough difference to work together effectively. Some of the ways to avoid conflicts are:
Font category: Make sure that you select fonts that are different enough even if they have the same subfamily.
Consider hierarchy: Use weight and size to distinguish between fonts. Hierarchy is essential, so choose fonts that highlight the relative importance of the text in your design.
Use color: If you want to highlight different segments of text, it’s a great idea to use different colors.
Now that you understand how to pair different fonts effectively, here are some latest font pairings to make your design stand out.
1. Proxima Nova and Futura:
Proxima Nova and Futura show us that you can stay in the same font subfamily and still manage contrast. They share a similarity in the shape of character and weight, so they work well together.
2. Bebas Neue and Libre Baskerville:
Bebas Neue is a bold and heavy sans-serif. While on the other hand, Libre Baskerville is a traditional, delicate serif font. They do not share x-height, the shape of character or weight but are similar in terms of the direction of the axis.
3. Nautilus Pompilius and Museo slab:
Museo Slab is a flexible serif while Nautilus Pompilius is a modern script. They both have unique character but still, share a similar weight to maintain proper balance.
4. Adobe Garamond and Hoefler:
Adobe Garamond and Hoefler are both beautiful old-style serif fonts but still work well with each other when it comes to font pairing.
5. Merriweather and Montserrat:
Montserrat is streamlined, modern and legible sans-serif font, while Merriweather is a classic serif font. They make a great pairing if you want your design to be minimalistic.
6. Source Sans Pro and Playfair Display:
Playfair Display is a traditional style font, while Source Sans is a very simple font. They give an elegant look to your design when paired together.
7. Lato and Raleway:
Raleway is a stylish yet simple sans-serif font that can be used with different design styles making it versatile. Lato is also a sans-serif that is much thinner and smaller, which complements the header text.