A rough guide to typeface pairing

Posted on by Hotfoot Design

We were recently asked by a client to change one of two typefaces on a website design because ‘they didn’t match’. They were referring to contrasting typefaces, one being serif and the other sans serif – so, although they weren’t the same, they worked together nicely as a team. The point the client was making, we found, was that they preferred the same typeface (concordance) throughout. It was a subjective decision.

When you’re working on pairing typefaces, there are three types of relationships between fonts that you’ll need as a rough guide:

Concordance

All of the type on your design is similar, typically used to refer to the use of a single typeface in multiple fonts on a page.

Contrasting

Two or more typefaces that are different but work well together.

Conflicting

Two typefaces which are too similar to one another to work nicely. The designer’s general rule is to try to achieve concordant or contrasting type, but avoid conflicting type.

Here’s a few examples.

Concordance – The same typeface in different font styles

1417397719Liberation-11

Contrasting – Mixing different typefaces that compliment each other

1417397716Contrast-1-1

Conflicting – Where there’s not enough difference in the size and weight of font

1417397713Conflict

Related Posts

This entry was posted in Fonts, Hotfoot, News, Typefaces on by .
Relevant Pages: Print Design & Production

We’d Love To Work With You

Get in touch & let’s chat through your project


Awards & Accreditations

  • The Drum Recommended
  • Marketing Lancashire
  • The Bibas Winner
  • Lancashire Business Awards Nominee 2016
  • Boost Business Lancashire
  • Cumbria Tourism
  • Awwwards Nominee 2016
  • Digital Lancashire Founding Member
  • Lakes Hospitality Association
  • Red Rose Winner