Fonts

Zilla Slab

Zilla Slab is our core typeface. We use it for our wordmark, for headlines, and throughout our designs. It’s a contemporary slab serif based on Typotheque’s Tesla. It’s constructed with smooth curves and true italics, which gives text an unexpectedly sophisticated industrial look and a friendly approachability in all weights. Zilla Slab is a free, open source font available for download.

Download from Github Use on Google Fonts

Open Sans

We also use Open Sans sometimes but we probably need to lay down some guidelines about why/where/when.

Type Scale

We define a limited set of proportional font sizes: 12px, 14px, 16px, 18px, 24px, 36px, 48px, 60px, and 72px.

We use SCSS mixins to declare these font sizes, and those mixins include media queries to adjust the sizes at key breakpoints. Text gets bigger as the viewport gets bigger.

@include font-size-huge;
@include font-size-level1;
@include font-size-level2;
@include font-size-level3;
@include font-size-level4;
@include font-size-level5;
@include font-size-level6;
@include font-size-small;
@include font-size-extra-small;