Developer API

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: オブジェクトの種類、webfont オブジェクト
  • family: ファミリーの名前
  • サブセット: ファミリーでサポートされるスクリプトのリスト
  • メニュー: ファミリー グループの名前の URL のみです。
  • バリエーション: ファミリーのバリエーションです。
  • version: フォント ファミリーのバージョン。
  • axes: 軸の範囲。可変フォントのリクエストに応じてのみ表示されます(下記参照)。
  • lastModified: フォント ファミリーが最後に変更された日付("yyyy-MM-dd")。
  • files: 使用可能な各バリアントのフォント ファミリー ファイル(サポートされているすべてのスクリプトを含む)

各ファミリーの情報を組み合わせると、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: 追加日(新しいフォントが最初に追加または更新されたフォント)を基準としてリストを並べ替える
  • 人気度: リストを人気順で並べ替え(人気順)
  • スタイル: 利用可能なスタイルの数(多くのスタイルがあるファミリー)を基準にリストを並べ替えます
  • 急上昇: 使用量の増加が見られるファミリー(最も増加しているファミリー)で並べ替え

フィルタリング

特定のファミリーに対してクエリを実行する

https://www.googleapis.com/webfonts/v1/webfonts?family=family_name

ギリシャ語のサブセットに対応しているすべてのファミリー

https://www.googleapis.com/webfonts/v1/webfonts?subset=subset_name

最適化

woff2 形式で圧縮されたフォント ファイルを取得する場合

https://www.googleapis.com/webfonts/v1/webfonts?capability=WOFF2

可変フォント

可変フォントの場合はスタイルが連続して使用できます。デフォルトでは、標準位置でインスタンス化された可変フォントに対して、静的フォント ファイルの組み合わせが返されます。capaibility=VF が設定されている場合、使用可能な軸範囲メタデータとともに、静的フォント ファイルではなく可変フォント ファイルが返されます。

https://www.googleapis.com/webfonts/v1/webfonts?capaibility=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
      }
    ]
  },
  [...]
 ]
}

API URL の仕様

webfonts?key=<your_key>[&family=<family>][&subset=<subset>][&capability=<capability>...][&sort=<sort>]

your_key: デベロッパーの API キー。

family: フォント ファミリーの名前。

subset: フォント サブセットの名前。

capability: VF | WOFF2

sort: alpha | date | popularity | style | trending