Font pairing

Pick a heading font, pick a body font that goes with it, and see the pair on a poster, an app screen and a logo. Every preview uses a free Google Font, so you can use what you see.

13 well-known fontsPreviewed with free Google Fonts
See the pairOn a poster, an app screen and a logo
Code to pasteHTML link, CSS and Tailwind v4
Where it came fromHistory and who uses it, sourced

Heading font

Helvetica with Inter

Preview uses Inter, the closest free match.

Some roads only go one way.

The Long Way Home

Two brothers, one borrowed car and a thousand miles of coast between them and the funeral. In cinemas this spring.

TitleTaglineBody text

Body font

Pairings for Inter, and why they work.

Use it

Both fonts are free under the licences on Google Fonts. Add the link to your page head, then set the families in CSS or in a Tailwind v4 theme.

HTML

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap">

CSS

h1, h2, h3 {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
}

body {
  font-family: 'Inter', sans-serif;
}

Tailwind v4

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap");
@import "tailwindcss";

@theme {
  --font-heading: 'Inter', sans-serif;
  --font-body: 'Inter', sans-serif;
}

/* Then use the font-heading and font-body classes. */

About Helvetica

The Swiss sans that ended up on subway signs and airline logos.

History

Max Miedinger designed it with Eduard Hoffmann at the Haas Type Foundry in Münchenstein, Switzerland, and it was released in 1957.[1]
It was first called Neue Haas Grotesk.[1]
Neue Helvetica followed in 1983, and Monotype released Helvetica Now in 2019.[1]

Who uses it

Lufthansa's corporate identity from 1962[1]
The American Airlines logotype set by Massimo Vignelli in 1967, used until 2013[1]
New York City Subway signage, the standard typeface from 1989[1]
Apple's iOS system font from 2007[1]

Sources

1. Wikipedia: Helvetica

Helvetica on its own page