Typography

Introduction · Lead typeface · Supporting typeface · Weights · Setting type · Hierarchy · Principles · Don'ts

We should make type both legible and readable: not only should it be easy to read, our audience should want to read it.

Lead typeface

We lead with our serif typeface, Instrument Serif. It is used for headlines, titles, and taglines, sized generously and at a relatively light weight.

Instrument Serif · Display

abcdefghijklmnopqrs
tuvwxyz 0123456789

Inter is our supporting typeface. It is used for body copy, and in contexts where many titles or headlines appear alongside each other.

Inter · Display

abcdefghijklmnopqr
stuvwxyz 0123456789

Type weight provides hierarchy to distinguish between pieces of information. Generally, we focus on a small number of relatively light weights.

Instrument Serif Regular

Instrument Serif

Inter Regular

Inter Medium

Inter SemiBold

When setting type, the leading should feel even across various applications.

Large Headline · Instrument Serif · 80/88pt · Sentence case

Type size × 1.1 = leading. Headlines at 80pt would have 88pt leading.

Headline · 30/36pt · Sentence case

Type size × 1.2 = leading. Headlines at 30pt would have 36pt leading.

Body · Inter Regular · 15/21pt · Sentence case

Type size × 1.4 = leading. Body copy at 15pt would have 21pt leading.

Our general typesetting principles.

This forces us to be clear in what we hope to express.

Everywhere, even in titles. We do this for simplicity.

If there is a difference between type sizes, make it really different.

Avoid squashing too much information onto a small area.