Usage

Quick start

Brick was built to be easy-to-use. For uniformity, our URL formatting rules are similar to those at Google Fonts.

To get started, simply add a stylesheet on your site with the following format:

<link rel="stylesheet" href="//brick.freetls.fastly.net/Font+Name:weights[:flags]/Font+Name...">

For example, to use EB Garamond (regular and italic) and Open Sans (regular and bold), simply use

<link rel="stylesheet" href="//brick.freetls.fastly.net/EB+Garamond:400,400i/Open+Sans:400,700">

This will generate the following response (formatted):

@font-face {
    font-family: 'EB Garamond';
    font-style: normal;
    font-weight: 400;
    src: local('EB Garamond 12'),url(//brick.freetls.fastly.net/fonts/ebgaramond/400.woff) format('woff');
}
@font-face {
    font-family: 'EB Garamond';
    font-style: italic;
    font-weight: 400;
    src: local('EB Garamond 12 Italic'),url(//brick.freetls.fastly.net/fonts/ebgaramond/400i.woff) format('woff');
}

@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Open Sans'),url(//brick.freetls.fastly.net/fonts/opensans/400.woff) format('woff');
}
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: local('Open Sans Bold'),url(http://brick.freetls.fastly.net/fonts/opensans/700.woff) format('woff');
}

Advanced usage

What's actually required

• The font name letter case is strict (use what's in the catalogue)
• Either a literal space (%20 URL encoded) or a + to represent spaces in the font name
• Numeral font weights
• That the font you're trying to retrieve actually exists in the catalogue

Flags

We have a set of flags that you can add after the weights for each font to customize exactly what response you get.

• f: Don't try to use local installed fonts (force from server)

For example, if you wanted to force from server for TeX Gyre Heros while loading Libre Baskerville normally, you would use

<link rel="stylesheet" href="//brick.freetls.fastly.net/TeX+Gyre+Heros:400,700:f/Libre+Baskerville:400">

Browser compatibility

Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
6.0	3.5 (1.9.1)	9.0	11.10	5.1

For full browser compatibility (including mobile), see http://caniuse.com/woff