Developer API を使用すると、Google Fonts が提供するすべてのファミリーのメタデータにアクセスできます。これにより、アプリは Google Fonts に使用可能なフォント ファミリーをクエリできます。REST API は、各ファミリーのスタイルとスクリプト（Google Fonts ではサブセットと呼ばれます）を含む JSON 形式でデータを提供します。API は、ファミリーのリストをアルファベット順、追加日順、スタイル数順、トレンド順、人気順で並べ替えることができます。
オーディエンス
このドキュメントは、ウェブ デベロッパーとアプリケーション デベロッパーを対象としています。Developer API を使用するには、JavaScript の知識が必要です。
簡単な例
Google Fonts サービスが提供するフォントの動的リストを取得するには、次のリクエストを送信します。
https://www.googleapis.com/webfonts/v1/webfonts?key=YOUR-API-KEY
結果の例は次のようになります。
{
"kind": "webfonts#webfontList",
"items": [
[...]
{
"family": "Anonymous Pro",
"variants": [
"regular",
"italic",
"700",
"700italic"
],
"subsets": [
"cyrillic",
"greek",
"latin",
"latin-ext"
],
"version": "v21",
"lastModified": "2022-09-22",
"files": {
"regular": "http://fonts.gstatic.com/s/anonymouspro/v21/rP2Bp2a15UIB7Un-bOeISG3pLlw89CH98Ko.ttf",
"italic": "http://fonts.gstatic.com/s/anonymouspro/v21/rP2fp2a15UIB7Un-bOeISG3pHl428AP44Kqr2Q.ttf",
"700": "http://fonts.gstatic.com/s/anonymouspro/v21/rP2cp2a15UIB7Un-bOeISG3pFuAT0CnW7KOywKo.ttf",
"700italic": "http://fonts.gstatic.com/s/anonymouspro/v21/rP2ap2a15UIB7Un-bOeISG3pHl4OTCzc6IG30KqB9Q.ttf"
},
"category": "monospace",
"kind": "webfonts#webfont",
"menu": "http://fonts.gstatic.com/s/anonymouspro/v21/rP2Bp2a15UIB7Un-bOeISG3pHl028A.ttf"
},
{
"family": "Antic",
"variants": [
"regular"
],
"subsets": [
"latin"
],
"version": "v19",
"lastModified": "2022-09-22",
"files": {
"regular": "http://fonts.gstatic.com/s/antic/v19/TuGfUVB8XY5DRaZLodgzydtk.ttf"
},
"category": "sans-serif",
"kind": "webfonts#webfont",
"menu": "http://fonts.gstatic.com/s/antic/v19/TuGfUVB8XY5DRZZKq9w.ttf"
},
[...]
]
}
Google でアプリケーションを識別する
アプリケーションは、Google Fonts Developer API にリクエストを送信するたびに、各リクエストに API キーを含めることで、自身を識別する必要があります。
API キーの取得と使用
キーの取得または、認証情報ページでキーを作成することもできます。
API キーを作成したら、アプリケーションですべてのリクエスト URL の末尾にクエリ パラメータ key=yourAPIKey を追加できます。
API キーは、安全に URL に埋め込むことができます。エンコーディングの必要はありません。
詳細
JSON レスポンス（上記のサンプルを参照）は、各フォント ファミリーに関する情報を含むオブジェクトを含む「items」という名前の配列で構成されています。
ファミリ オブジェクトは次のフィールドで構成されます。
- kind: オブジェクトの種類（ウェブフォント オブジェクト）
- family: ファミリーの名前
- サブセット: ファミリーでサポートされているスクリプトのリスト
- menu: ファミリーの名前のみを含むファミリー サブセットの URL。
- バリエーション: ファミリーで使用できるさまざまなスタイル
- version: フォント ファミリーのバージョン。
- axes: 軸の範囲。可変フォントの場合、リクエストに応じてのみ表示されます（下記参照）。
- lastModified: フォント ファミリーが最後に変更された日付（「yyyy-MM-dd」形式）。
- files: 利用可能なバリエーションごとに、フォント ファミリー ファイル（サポートされているすべてのスクリプトを含む）。
- color_capabilities: このファミリーでサポートされている色形式（ある場合）
- tags: このファミリーの設計空間全体に適用されるタグ。リクエストがあった場合にのみ提示します（下記を参照）。
各ファミリーの情報を組み合わせることで、Fonts API リクエストを簡単に作成できます。たとえば、Anonymous Pro のファミリー オブジェクトへの参照があるとします。
[...]
var apiUrl = [];
apiUrl.push('https://fonts.googleapis.com/css?family=');
apiUrl.push(anonymousPro.family.replace(/ /g, '+'));
if (contains('italic', anonymousPro.variants)) {
apiUrl.push(':');
apiUrl.push('italic');
}
if (contains('greek', anonymousPro.subsets)) {
apiUrl.push('&subset=');
apiUrl.push('greek');
}
// url: 'https://fonts.googleapis.com/css?family=Anonymous+Pro:italic&subset=greek'
var url = apiUrl.join('');
[...]
並べ替え
デフォルトでは、ファミリーのリストは特定の順序で返されません。ただし、sort パラメータを使用してリストを並べ替えることは可能です。
https://www.googleapis.com/webfonts/v1/webfonts?sort=popularity
並べ替えに使用できる値は次のとおりです。
- alpha: リストをアルファベット順に並べ替えます
- date: リストを追加日で並べ替えます（最近追加または更新されたフォントが最初に表示されます）。
- popularity: リストを人気順に並べ替えます（最も人気のあるファミリーが先頭になります）。
- style: 利用可能なスタイルの数でリストを並べ替えます（最も多くのスタイルがあるファミリーが先頭になります）
- trending: 使用量が増加しているファミリーでリストを並べ替えます（使用量が最も増加しているファミリーが最初に表示されます）。
フィルタリング
特定のファミリをクエリする
https://www.googleapis.com/webfonts/v1/webfonts?family=family_name
ギリシャ語のサブセットをサポートするすべてのファミリー
https://www.googleapis.com/webfonts/v1/webfonts?subset=subset_name
フォント カテゴリでフィルタする
https://www.googleapis.com/webfonts/v1/webfonts?category=category_name
最適化
woff2 形式で圧縮されたフォント ファイルを取得する場合
https://www.googleapis.com/webfonts/v1/webfonts?capability=WOFF2
可変フォント
可変フォントは、スタイルの連続的な範囲を提供します。デフォルトでは、標準位置でインスタンス化された可変フォントに対して、静的フォント ファイルの組み合わせが返されます。capability=VF が設定されている場合、利用可能な軸の範囲のメタデータとともに、静的フォントではなくバリアブル フォント ファイルが返されます。サンプル例:
https://www.googleapis.com/webfonts/v1/webfonts?capability=VF
レスポンスの例:
{
"kind": "webfonts#webfontList",
"items": [
[...]
{
"family": "Noto Sans Display",
"variants": [
"regular",
"italic"
],
"subsets": [
"cyrillic",
"cyrillic-ext",
"greek",
"greek-ext",
"latin",
"latin-ext",
"vietnamese"
],
"version": "v20",
"lastModified": "2022-09-22",
"files": {
"regular": "http://fonts.gstatic.com/s/notosansdisplay/v20/RLplK4fy6r6tOBEJg0IAKzqdFZVZxokvfn_BDLxR.ttf",
"italic": "http://fonts.gstatic.com/s/notosansdisplay/v20/RLpjK4fy6r6tOBEJg0IAKzqdFZVZxrktdHvjCaxRgew.ttf"
},
"category": "sans-serif",
"kind": "webfonts#webfont",
"menu": "http://fonts.gstatic.com/s/notosansdisplay/v20/RLpbK4fy6r6tOBEJg0IAKzqdFZVZxpMkXJMhnB9XjO1o90LuV-PT4Doq_AKp_3cKZTCa3g.ttf",
"axes": [
{
"tag": "wdth",
"start": 62.5,
"end": 100
},
{
"tag": "wght",
"start": 100,
"end": 900
}
]
},
[...]
]
}
タグ
capability=FAMILY_TAGS が設定されている場合、タグ フィールドには、ファミリーの設計空間全体に関連するすべてのタグが入力されます。
サンプル例:
{
"kind": "webfonts#webfontList",
"items": [
[...]
{
"family": "Noto Sans Display",
"variants": [
"regular",
"italic"
],
"subsets": [
"cyrillic",
"cyrillic-ext",
"greek",
"greek-ext",
"latin",
"latin-ext",
"vietnamese"
],
"version": "v20",
"lastModified": "2022-09-22",
"files": {
"regular": "http://fonts.gstatic.com/s/notosansdisplay/v20/RLplK4fy6r6tOBEJg0IAKzqdFZVZxokvfn_BDLxR.ttf",
"italic": "http://fonts.gstatic.com/s/notosansdisplay/v20/RLpjK4fy6r6tOBEJg0IAKzqdFZVZxrktdHvjCaxRgew.ttf"
},
"category": "sans-serif",
"kind": "webfonts#webfont",
"menu": "http://fonts.gstatic.com/s/notosansdisplay/v20/RLpbK4fy6r6tOBEJg0IAKzqdFZVZxpMkXJMhnB9XjO1o90LuV-PT4Doq_AKp_3cKZTCa3g.ttf",
"tags": [
{
"name": "/Expressive/Business",
"weight": 58
},
{
"tag": "/Sans/Humanist",
"weight": 100,
}
]
},
[...]
]
}
API URL 仕様
webfonts?key=<your_key>[&family=<family>][&subset=<subset>][&capability=<capability>...][&sort=<sort>]
your_key: デベロッパー API キー。
family: フォント ファミリーの名前。
subset: フォント サブセットの名前。
category: serif | sans-serif | monospace | display | handwriting
capability: VF | WOFF2。
sort: alpha | date | popularity | style | trending。