[Font] オープンソースのWebフォント「Brick」

記事内にプロモーションを含む場合があります。

WebFont Brick 01

無料で利用できるWebフォントといえばGoogleフォントの他に、このBrickがあります。

オープンソースのWebフォントで、利用は無料。Googleフォントと同じくヘッダーに読み込むだけで使えます。ストックされているフォントは、十数種類あり、お好みに合わせてチョイスすることができます。

WebFont Brick 02

使い方はGoogleフォントと同じで、ヘッダーに読み込みタグを入力してスタイルシートで指定します。

head

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

css

@font-face {
    font-family: 'EB Garamond';
    font-style: normal;
    font-weight: 400;
    src: local('EB Garamond 12'),url(//brick.a.ssl.fastly.net/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.a.ssl.fastly.net/ebgaramond/400i.woff) format('woff');
}

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

Source: Brick. Webfonts that actually look good.