Font Pairing Previewer

Preview curated Google Font heading & body pairings with live editable text.

● runs in your browser

pairing

Playfair Display + Source Sans 3· classic, magazine

↑ the heading and body text are editable — click and type to preview your own copy.

CSS / embed

/* in your <head> */
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&family=Source+Sans+3:wght@400;700&display=swap" rel="stylesheet">

h1, h2, h3 { font-family: 'Playfair Display', sans-serif; }
body { font-family: 'Source Sans 3', sans-serif; }

Curated Google Font pairings for headings & body, with live editable preview. Fonts load from Google Fonts for the preview; the snippet shows how to use them in your own site.