Zilla Slab

Classification

Font Technology

Static font
5 weights, 2 styles

How To Use Zilla Slab

To use Zilla Slab in your web project, either search Google Fonts and use their embed code or host the font on your server and use the CSS below. Note: fonts served by Google Fonts may be missing some OpenType features that are available in the original font.
@font-face {
  font-family: 'Zilla Slab';
  src: url('<YOUR SERVER PATH>ZillaSlab-Light.ttf') format(woff2);
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Zilla Slab';
  src: url('<YOUR SERVER PATH>ZillaSlab-Regular.ttf') format(woff2);
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Zilla Slab';
  src: url('<YOUR SERVER PATH>ZillaSlab-Medium.ttf') format(woff2);
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Zilla Slab';
  src: url('<YOUR SERVER PATH>ZillaSlab-SemiBold.ttf') format(woff2);
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Zilla Slab';
  src: url('<YOUR SERVER PATH>ZillaSlab-Bold.ttf') format(woff2);
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Zilla Slab';
  src: url('<YOUR SERVER PATH>ZillaSlab-LightItalic.ttf') format(woff2);
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: 'Zilla Slab';
  src: url('<YOUR SERVER PATH>ZillaSlab-Italic.ttf') format(woff2);
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'Zilla Slab';
  src: url('<YOUR SERVER PATH>ZillaSlab-MediumItalic.ttf') format(woff2);
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: 'Zilla Slab';
  src: url('<YOUR SERVER PATH>ZillaSlab-SemiBoldItalic.ttf') format(woff2);
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: 'Zilla Slab';
  src: url('<YOUR SERVER PATH>ZillaSlab-BoldItalic.ttf') format(woff2);
  font-weight: 700;
  font-style: italic;
}

Description

Zilla Slab is Mozilla's core typeface, used for the Mozilla wordmark, headlines and throughout their designs. A contemporary slab serif, based on Typotheque's Tesla, it is constructed with smooth curves and true italics, which gives text an unexpectedly sophisticated industrial look and a friendly approachability in all weights. Designed by Typotheque , this project is led by Mozilla. To contribute, see github.com/mozilla/zilla-slab

Designer

Typotheque

Copyright

Copyright 2017, The Mozilla Foundation

OpenType Features

Related Fonts

Zilla Slab 300
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
We are such stuff as dreams are made on, and our little life is rounded with a sleep. Be not afeard; the isle is full of noises, sounds, and sweet airs that give delight and hurt not. Sometimes a thousand twangling instruments will hum about mine ears.
, : ; ? ! " “ ” ' ‘ ’ « » ′ ″ ( ) [ ] { } 〈 〉 - – — ‒ ― / | ⁄ … • · § ¶ * ~ ^ ° © ® ™
Slashed Zero
default css
font-feature-settings: "zero" 1
0
0
Zilla Slab regular
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
We are such stuff as dreams are made on, and our little life is rounded with a sleep. Be not afeard; the isle is full of noises, sounds, and sweet airs that give delight and hurt not. Sometimes a thousand twangling instruments will hum about mine ears.
, : ; ? ! " “ ” ' ‘ ’ « » ′ ″ ( ) [ ] { } 〈 〉 - – — ‒ ― / | ⁄ … • · § ¶ * ~ ^ ° © ® ™
Slashed Zero
default css
font-feature-settings: "zero" 1
0
0
Zilla Slab 500
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
We are such stuff as dreams are made on, and our little life is rounded with a sleep. Be not afeard; the isle is full of noises, sounds, and sweet airs that give delight and hurt not. Sometimes a thousand twangling instruments will hum about mine ears.
, : ; ? ! " “ ” ' ‘ ’ « » ′ ″ ( ) [ ] { } 〈 〉 - – — ‒ ― / | ⁄ … • · § ¶ * ~ ^ ° © ® ™
Slashed Zero
default css
font-feature-settings: "zero" 1
0
0
Zilla Slab 600
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
We are such stuff as dreams are made on, and our little life is rounded with a sleep. Be not afeard; the isle is full of noises, sounds, and sweet airs that give delight and hurt not. Sometimes a thousand twangling instruments will hum about mine ears.
, : ; ? ! " “ ” ' ‘ ’ « » ′ ″ ( ) [ ] { } 〈 〉 - – — ‒ ― / | ⁄ … • · § ¶ * ~ ^ ° © ® ™
Slashed Zero
default css
font-feature-settings: "zero" 1
0
0
Zilla Slab 700
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
We are such stuff as dreams are made on, and our little life is rounded with a sleep. Be not afeard; the isle is full of noises, sounds, and sweet airs that give delight and hurt not. Sometimes a thousand twangling instruments will hum about mine ears.
, : ; ? ! " “ ” ' ‘ ’ « » ′ ″ ( ) [ ] { } 〈 〉 - – — ‒ ― / | ⁄ … • · § ¶ * ~ ^ ° © ® ™
Slashed Zero
default css
font-feature-settings: "zero" 1
0
0
Zilla Slab 300italic
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
We are such stuff as dreams are made on, and our little life is rounded with a sleep. Be not afeard; the isle is full of noises, sounds, and sweet airs that give delight and hurt not. Sometimes a thousand twangling instruments will hum about mine ears.
, : ; ? ! " “ ” ' ‘ ’ « » ′ ″ ( ) [ ] { } 〈 〉 - – — ‒ ― / | ⁄ … • · § ¶ * ~ ^ ° © ® ™
Slashed Zero
default css
font-feature-settings: "zero" 1
0
0
Zilla Slab italic
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
We are such stuff as dreams are made on, and our little life is rounded with a sleep. Be not afeard; the isle is full of noises, sounds, and sweet airs that give delight and hurt not. Sometimes a thousand twangling instruments will hum about mine ears.
, : ; ? ! " “ ” ' ‘ ’ « » ′ ″ ( ) [ ] { } 〈 〉 - – — ‒ ― / | ⁄ … • · § ¶ * ~ ^ ° © ® ™
Slashed Zero
default css
font-feature-settings: "zero" 1
0
0
Zilla Slab 500italic
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
We are such stuff as dreams are made on, and our little life is rounded with a sleep. Be not afeard; the isle is full of noises, sounds, and sweet airs that give delight and hurt not. Sometimes a thousand twangling instruments will hum about mine ears.
, : ; ? ! " “ ” ' ‘ ’ « » ′ ″ ( ) [ ] { } 〈 〉 - – — ‒ ― / | ⁄ … • · § ¶ * ~ ^ ° © ® ™
Slashed Zero
default css
font-feature-settings: "zero" 1
0
0
Zilla Slab 600italic
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
We are such stuff as dreams are made on, and our little life is rounded with a sleep. Be not afeard; the isle is full of noises, sounds, and sweet airs that give delight and hurt not. Sometimes a thousand twangling instruments will hum about mine ears.
, : ; ? ! " “ ” ' ‘ ’ « » ′ ″ ( ) [ ] { } 〈 〉 - – — ‒ ― / | ⁄ … • · § ¶ * ~ ^ ° © ® ™
Slashed Zero
default css
font-feature-settings: "zero" 1
0
0
Zilla Slab 700italic
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
We are such stuff as dreams are made on, and our little life is rounded with a sleep. Be not afeard; the isle is full of noises, sounds, and sweet airs that give delight and hurt not. Sometimes a thousand twangling instruments will hum about mine ears.
, : ; ? ! " “ ” ' ‘ ’ « » ′ ″ ( ) [ ] { } 〈 〉 - – — ‒ ― / | ⁄ … • · § ¶ * ~ ^ ° © ® ™
Slashed Zero
default css
font-feature-settings: "zero" 1
0
0