Playfair Display and Source Sans 3 Font Pairing

Set in Playfair Display 700 and Source Sans 3 400

‹Next pair ›

Playfair Display at 700 for headings and Source Sans 3 for body text make a high-contrast, elegant pair that still reads easily on a phone. The sharp serif headings bring a sense of occasion, while the clean sans serif keeps paragraphs relaxed and open. It suits lifestyle and recipe blogs, wedding websites and invitations, and portfolios that want editorial polish without feeling stiff.

A type specimen for Playfair Display and Source Sans 3. Captions like this one are set in Source Sans 3 at 14.5px.

Why Playfair Display and Source Sans 3 Work Together

Playfair Display is a transitional serif with very high stroke contrast: thick vertical stems sit next to hairline curves and fine serifs, showing the influence of John Baskerville and Scotch Roman types. That contrast makes a Playfair headline look dressed up. It is also why it needs a calm partner, because two expressive faces would compete on the same page.

Source Sans 3, designed by Paul D. Hunt as a sans serif intended to work well in user interfaces, is that calm partner. Its strokes are nearly even in thickness, its letters are open, and its spacing is comfortable, so paragraphs feel light next to the dark, tightly drawn headings. You get one clear contrast, serif against sans serif and high contrast against low, which makes the hierarchy obvious at a glance.

Where Playfair Display and Source Sans 3 Work Best

The pairing shines wherever presentation matters as much as information. A food or travel blog can use Playfair for recipe titles and Source Sans 3 for ingredient lists and method steps. A couple’s wedding site gets a formal feel for names and dates while the schedule stays easy to scan, and the same fonts carry over to a printed save-the-date card. Photographers and illustrators can set project titles in Playfair and keep captions in Source Sans 3.

Weights and Sizes to Use

Set headings at 700. Playfair Display runs from 400 to 900, and 700 gives the hairlines enough weight to hold up on lower-resolution screens without turning heavy. Keep it above roughly 28px so the thin strokes do not break up, with a line height of 1.1 to 1.2. Use Source Sans 3 at 400 for body text and 700 for bold, at 17 or 18px with a line height of 1.6. Its range runs from 200 to 900, so 600 works well for small labels and buttons.

Things to Watch

Playfair Display is drawn for large sizes, so keep it out of body copy, small captions and navigation menus, where the hairlines get lost. Its italic is lively and decorative; save it for a word or two rather than whole paragraphs. On dark backgrounds the fine strokes can fade, so test a light-on-dark heading at full size before committing.

Similar Pairings

Pairs with a similar elegant feel, each with its own page.

Browse all 62 font pairings ›