WordPress Fonts That Pair Well

Building or updating a WordPress site can be a lot of fun. You get to put your personality into it and build something you can be proud of.

One of the most important elements of your site is the font pairing you choose. There are hundreds of WordPress fonts out there, but they certainly don’t all pair well.

That’s why we researched the best WordPress fonts that pair better than milk and cookies… according to science! We also give you some WordPress font examples from some beautifully-designed sites, so you can pick and choose what fits your site’s brand.

But first… why should you even care?

1. Why your font choice matters

The font you choose might seem totally unimportant at first glance. As long as it’s legible, who cares what font type you use, right?

Well, typeface actually matters. Different font types have different levels of readability, different personality and style, and convey very different messages to your readers.

We’ll get more into what message certain fonts present in the next two sections, but it boils down to this:

People will judge your site’s feel and trustworthiness based on your font choice. So choose well!

2. The psychology of typeface

While it’s not an exact science, there is a psychology behind your font choice. Different typefaces put people into different moods.

While I could write a full paper on the different studies that have been done around this, instead I’ll just show you an infographic made by Ted Hunt for CrazyEgg.

The Psychology of WordPress Fonts That Pair Well

As you can see, there are five major categories of font types:

  1. Serif (The traditional typeface – not good for reading on the web, better for headings than body copy)
  2. Sans Serif (A clean, modern font – high readability, great for body copy, the most popular choice for WordPress sites)
  3. Modern (A progressive, stylish font – good readability, can be used for body text or headings)
  4. Display (The personality choice – alright readability, better for headers than as the main font)
  5. Script (The fancy font – lowest readability, please don’t use this in your body, and use sparingly for headings, better for logos)

So ask yourself:

What kind of personality does your brand have? What do you want people to feel when they visit your site – clean and modern, cheeky and edgy, fancy, traditional, or unique?

Pick the fonts that best pair with that.

3. WordPress fonts that pair well

If you can’t decide what fonts to use, don’t worry – I totally understand. Choosing the right font combination can be stressful. That’s why I made this section – to give you WordPress fonts examples from beautifully designed sites.

In other words, to remove the guesswork, so you can make your site look amazing as quickly as possible.

Think of this as a sort of WordPress font list. I’ll give you one example of each font family. Let’s get right to it!

The Wall Street Journal

The Wall Street Journal's Font Combinations

The Wall Street Journal uses a very traditional type. Their logo uses Escrow, a serif type font. However, their body still uses sans-serif, which you’ll find on almost every website today because of it’s extremely high readability.

Fonts used:  Escrow, Whitney SSm, Chronicle Display, Chronicle SSm 

CoSchedule

CoSchedule's Typeface

I love CoSchedule‘s design. They have a very clean, modern look thanks to the sans-serif font. They also use a lot of flat icons and vector graphics, and soft but strong colors to accent that feel.

Fonts used:  Brandon Grotesque, Museo Sans 

Cooper Hewitt

Cooper Hewitt homepage

Cooper Hewitt IS a font – a modern-style font. And they have a website. Their look is more progressive and chic with big, bold lettering.

Fonts used:  Cooper Hewitt, Cooper Hewitt Display 

A Better Lemonade Stand

A Better Lemonade Stand Typeface

A Better Lemonade Stand uses sans serif for most of its fonts, but their logo uses a more expressive display font. It’s unique, yet clean.

Fonts used:  Mission Script, Brandon Grotesque 

WebLounge

Web Lounge Homepage

Web Lounge uses a combination of traditional sans font, elegant script font, and sans serif fonts. They actually won a spot on Awwwards 20 best web font choices.

Fonts used:  Museo Sans, Playfair Display 

Pro Tip: See a font you like on a certain site? Use the WhatFont Chrome extension to quickly see what fonts they’re using!

4. How to change fonts in a WordPress theme

You can change fonts across your entire theme, or in individual WordPress posts and pages. It’s not very difficult, especially if you’re using a good theme.

We’ve already written an extensive guide on how to change your WordPress typography. So go check it out if you need help updating your fonts.

(It gives you three options – the theme settings, with a plugin, or with code. Whichever is easiest for you!)

Conclusion

There are so many friggin’ choices when it comes to WordPress fonts. Don’t freak out and don’t succumb to analysis paralysis. It all boils down to a simple three-step process:

  1. Decide what emotions you want your site and your brand to convey
  2. Pick a font from the family that conveys that emotion (more on that in the infographic)
  3. Find a good sans serif font for your main body text that pairs well with your heading font

With all the examples and information we gave you here, you should have no problem choosing an awesome font.

Over to you: What are your favorite WordPress fonts? Let us know in the comments below.

P.S. Tired of your current WordPress theme and dying for a fresh look? Check out our library of over 30+ free and premium WordPress themes!

Free guide

5 Essential Tips to Speed Up
Your WordPress Site

Reduce your loading time by even 50-80%
just by following simple tips.

Download free guide