T·C TypeCraft open-source typography directory Browse all 1,929 fonts

Pairing guides

Curated Google Fonts combinations from working studios — a heading face and a body face that won't fight each other on the page. Live specimens, design rationale, and copy-paste CSS embed code for each pair.

10 editorial pairings · all open-source · all free

A great pair.
A heading face is only half the job. The body partner has to disappear quietly into the paragraph and let the meaning of the words come through.
Fraunces + Inter Editorial warmth meets neutral interface clarity.
A great pair.
A heading face is only half the job. The body partner has to disappear quietly into the paragraph and let the meaning of the words come through.
Playfair Display + Source Sans 3 High-contrast modern serif with a workhorse humanist sans.
A great pair.
A heading face is only half the job. The body partner has to disappear quietly into the paragraph and let the meaning of the words come through.
Lora + Work Sans A calligraphic text serif meets a clean grotesque sans.
A great pair.
A heading face is only half the job. The body partner has to disappear quietly into the paragraph and let the meaning of the words come through.
Space Grotesk + IBM Plex Mono A neo-grotesque heading face anchored by a credible mono.
A great pair.
A heading face is only half the job. The body partner has to disappear quietly into the paragraph and let the meaning of the words come through.
Manrope + Source Serif 4 Geometric sans heading on a literary text serif.
A great pair.
A heading face is only half the job. The body partner has to disappear quietly into the paragraph and let the meaning of the words come through.
Archivo + Libre Caslon Text A versatile grotesque in front of a quiet classical serif.
A great pair.
A heading face is only half the job. The body partner has to disappear quietly into the paragraph and let the meaning of the words come through.
DM Serif Display + DM Sans Two siblings from the same studio, designed to live together.
A great pair.
A heading face is only half the job. The body partner has to disappear quietly into the paragraph and let the meaning of the words come through.
EB Garamond + IBM Plex Sans Renaissance text serif paired with a modern corporate sans.
A great pair.
A heading face is only half the job. The body partner has to disappear quietly into the paragraph and let the meaning of the words come through.
Bricolage Grotesque + Instrument Serif A contemporary variable grotesque opposite a sharp display serif.
A great pair.
A heading face is only half the job. The body partner has to disappear quietly into the paragraph and let the meaning of the words come through.
JetBrains Mono + Inter A coding mono with first-class ligatures and a neutral UI sans.

How to think about font pairings

The simplest, oldest rule of font pairing is this: contrast plus consistency. The heading face and the body face need to differ enough that the eye reads them as belonging to different roles in the hierarchy — but they need to feel like they were chosen for the same job. A high-contrast modern serif over a humanist sans is contrast plus consistency. Two unrelated grotesques are contrast without consistency. A serif and the same serif at a heavier weight is consistency without contrast.

The pairings collected here all follow that rule. Some of them are family pairings, designed by the same studio with the explicit intention of being set together — DM Serif Display with DM Sans is the canonical example. Others are independent designs that happen to harmonise: Fraunces with Inter, Lora with Work Sans, Space Grotesk with IBM Plex Mono. In every case we tested the combination at heading sizes, sub-heading sizes, and body sizes, on light and dark backgrounds, before recommending it.

Each pairing page below documents the design rationale, the recommended size and weight pairing, the contexts the combination has been deployed in successfully, and the copy-paste CSS embed code you need to ship the pair into a real project. Browse the grid above, or jump to one of our use-case-specific buyer guides for ranked recommendations on a single category.