Bitter and Public Sans Font Pairing
Set in Bitter 700 and Public Sans 400
@import url('https://fonts.googleapis.com/css2?family=Bitter:wght@700&family=Public+Sans:wght@400;700&display=swap');
body {
font-family: 'Public Sans', system-ui, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Bitter', Georgia, serif;
font-weight: 700;
}Bitter at weight 700 gives headings a sturdy, friendly slab serif voice, and Public Sans keeps body text neutral, clear and straightforward. Together they look honest and practical, with enough warmth to avoid feeling bureaucratic. This pairing fits business sites, blogs and resumes, anywhere you need information to come across as reliable and easy to read.
Bitter & Public Sans
Headings 700, body text 400
ABCDEFGHIJKLM
abcdefghijklm
0123456789 &?!
Body text has to stay comfortable from the first line to the last.
Why Bitter and Public Sans Work Together
Bitter is a slab serif: its serifs are thick, squared blocks rather than tapered points, and its stroke contrast is low. At 700 it looks solid and approachable, a little like a well-designed typewriter face. Public Sans is a neutral sans serif listed on Google Fonts as designed by USWDS, the US Web Design System, among others, and it has the plain, functional look of government and public service sites.
The contrast is clear without being dramatic. Slab serifs give headings visible structure and a friendly bluntness, while Public Sans has simple, even strokes that disappear into the reading. Both have fairly generous x-heights and sturdy proportions, so they sit comfortably together on screens. The result feels dependable and human, which suits content people need to trust and understand quickly.
Where Bitter and Public Sans Work Best
A local accounting practice, a non-profit or a contractor could use Bitter for headlines and Public Sans for service descriptions and contact details. On a blog with how-to guides, Bitter makes each title feel solid, and Public Sans keeps steps and tables readable. For a one-page resume, use Bitter for your name and section titles and Public Sans for job details.
Weights and Sizes to Use
Use Bitter at 700 for headings; its Google Fonts range runs from 100 to 900, so you can drop to 600 for subheads. Set Public Sans at 400 for body and 700 for bold, at 16 to 18px on screens with a line height around 1.6. For a printed resume, 10 or 11pt body text works well. Keep Bitter headings at a line height of about 1.15 to 1.25.
Things to Watch
Bitter is heavy at 700, so large blocks of bold heading text can dominate a page; keep headlines short and give them breathing room. Public Sans is deliberately plain, which is a strength for clarity but can feel generic, so let Bitter and your colours carry the personality. On resumes, avoid using Bitter for body details, as slab serifs in small dense text look crowded.
Similar Pairings
Pairs with a similar friendly feel, each with its own page.
Rubik & Nunito Sans
Good type disappears into the reading. The heading sets the tone, and the body font carries the story to the last line.
Poppins & Lora
A well-made pair feels like one voice in two registers: a confident headline and a calm, even paragraph underneath.
Fraunces & Inter
Readers spend most of their time in body text, so it has to stay comfortable from the first paragraph to the tenth.