Typeface

Gotham designed by Hoefler & Co is a highly legible and compact typeface intended for signs and editorial design.

Gotham Light

Aa

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
\?!@£$%&1234567890

Gotham Book

Aa

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
\?!@£$%&1234567890

Gotham Medium

Aa

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
\?!@£$%&1234567890

Gotham Bold

Aa

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
\?!@£$%&1234567890

Gotham Black

Aa

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
\?!@£$%&1234567890

Typographic Scale

A modular, pentatonic scale that matches the so called Classic Typographic Scale.

The scale works by having a fixed ratio – two – with a set number of ‘notes’ in between – five. In other words every fifth ‘note’, the font size doubles. The base font-size is 12 px set on the <html> element.

a a a a a a a a a a a a a a a a a a a a a
Element Frequency SASS Function Pixels
HTML root 0 ms(0) 12 px
1 ms(1) 14 px
Table headings 2 ms(2) 16 px
Tables 3 ms(3) 18 px
Body, Subheadings 4 ms(4) 21 px
Headings 5 ms(5) 24 px
6 ms(6) 28 px
7 ms(7) 32 px
8 ms(8) 36 px
9 ms(9) 42 px
Page title 10 ms(10) 48 px
11 ms(11) 55 px
12 ms(12) 63 px
13 ms(13) 73 px
14 ms(14) 84 px
15 ms(15) 96 px
16 ms(16) 110 px
17 ms(17) 127 px
18 ms(18) 146 px
19 ms(19) 167 px
20 ms(20) 192 px