Great fonts are essential to great design. But picking great fonts can seem like an impossible dark art for most people. In the article below I’ll explain the basics of choosing great fonts and then give you my favorite combinations that you can use in your own designs.
These font pairs are perfect if you are trying to create your next presentation, social media graphic or anything else you’d like to design. Of course, all of these fonts are available for you to use – for free – inside Canva.
There’s a science to applying a heading, subheading and body copy to suit the type of content you’re producing and the message or tone of your brand.
Font/Typography Terms
Serif: a typeface with a small projection at the ends of letter strokes.
Sans-serif: a typeface without any stroke embellishments and details.
Slab-serif: a typeface that's identified by its thick, block-like serifs.
Script: a typeface that links together letter-to-letter and best used for headings and display.
Display: a typeface that is best used at 30 points or larger. These should mainly be used as header fonts and rarely in body text.
Handwriting: a typeface that looks as if it could be hand drawn or written. This could incorporate a script font or a block letter font.
Monospace: a non-proportional typeface where its numbers and letters take up the same amount of space. These fonts can look more spaced out and often look more harsh.
Where to Start With Your Font Pairings
Majority of businesses are only going to need two fonts, a header font, and body font, but occasionally you may find you want a third font (a sub-heading font or accent font to use throughout your website for certain calls to action or emphasis).
Another factor in your font pairings is how they will display online. Without getting into the complicated aspects of web design, browser design, and general coding - not all fonts can be read well online or across web browsers.
To mitigate these issues, I always look to Google Fonts when I'm deciding on my perfect font pairings for a website and brand. Google Fonts are free to use and can be read well online and across web browsers (and are incredibly easy to load onto your 3 Step Solutions website!).
Perfect Font Pairings
Of course, you can always go to Google Fonts and choose your own font pairings, but we're sharing some pairs that work great together!
1. Playfair Display + Lato
2. Playfair Display + Raleway
3. Black Han Sans + Open Sans
4. Montserrat + Lato
5. Inconsolata + Noto Sans
6. Inconsolata + Montserrat
7. Pacifico + Opens Sans
8. Shadows Into Light + Raleway
9. Shadows Into Light + Roboto
10. Satisfy + Open Sans
11. Sacramento + Josefin Slab
12. Sacramento + Roboto
13. Walter Turncoat + Oswald Light
14. Clicker Script + Raleway
15. Roboto Mono + Roboto
16. Cutive Mono + Raleway
17. Arima Madurai + Open Sans
18. Cabin Sketch + Oswald
19. Pompiere + Raleway
20. Baloo Tammudu + Montesserat
21. Lora + Open Sans
22. IM Fell DW Pica + Open Sans
23. Della Respira + Roboto
24. Gafata + Open Sans
25. Carrois Gothic SC + Raleway
26. Palanquin Dark + Hind
27. Federo + Open Sans
28. Mallanna + Open Sans
29. Kite One + Raleway
30. Nanum Gothic + Lato
Accent Fonts
While a majority of the time you will only need two fonts, sometimes you find yourself needing a third. I call this additional font and accent font. You may use it on a sales page or in a call to action - it's your go-to font choice to draw extra attention or emphasis.
Below are a few of my favorite that you may find to be perfect on your website as well.
Rock Salt
Homemade Apple
Reenie Beanie
Walter Turncoat
Seaweed Script
Londrina Outline (or Shadow)
What If I Don't Like These Font Pairings?
These may be the perfect font pairings for your website or they may not be, to discover the pairs that really inspire you, head to
Google Fonts and search for your header font first.
When you find a header font you like, click on it and scroll down the paid until you see "Popular Pairings" so you can see what will work well with your chosen header font. Alternatively, you can search through the "Sans Serif" typefaces.
Think I've left out some great pairings? Have different pairings you love on your website? Let me know in the comments below!