Work Sans + Source Serif 4

7/10 warm-professional

Live Preview

. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Why This Pairing Works

Work Sans provides friendly, approachable headlines with subtle quirks, while Source Serif 4 brings traditional readability to body text. Warm and professional.

Type Specimen

Heading

View font →
Work Sans
AaBbCcDdEeFfGg
0123456789 !@#$%
Sans Serif 9 weights

Body

View font →
Source Serif 4
AaBbCcDdEeFfGg
0123456789 !@#$%
Serif 8 weights

How to Use

HTML 

<link href="https://fonts.googleapis.com/css2?family=Work+Sans:wght@100;200;300;500;600;700;800;900;400&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Source+Serif+4:wght@200;300;500;600;700;800;900;400&display=swap" rel="stylesheet">

CSS

h1, h2, h3, h4, h5, h6 {
  font-family: 'Work Sans', sans-serif;
}

body, p, li {
  font-family: 'Source Serif 4', serif;
}

Pairing Details

Score
7/10
Mood
warm-professional
Heading
Work Sans
Body
Source Serif 4
Heading category
Sans Serif
Body category
Serif

Best For

blog nonprofit education

Quick Links