API para desarrolladores

La API para desarrolladores brinda acceso a los metadatos de todas las familias que entrega Google Fonts. Permite que las apps consulten Google Fonts para obtener las familias de fuentes disponibles. La API de REST proporciona datos en formato JSON que incluyen los estilos y las secuencias de comandos (llamados subconjuntos en Google Fonts) de cada familia. La API puede ordenar la lista de familias alfabéticamente, por fecha de incorporación, por cantidad de estilos, por tendencia o por popularidad.

Público

Este documento está dirigido a desarrolladores web y de aplicaciones. Para usar la API para desarrolladores, se requiere conocimiento de JavaScript.

Ejemplo rápido:

Para recuperar la lista dinámica de fuentes que ofrece el servicio de Google Fonts, envía la siguiente solicitud:

https://www.googleapis.com/webfonts/v1/webfonts?key=YOUR-API-KEY

Un ejemplo del resultado se vería de la siguiente manera:

{
 "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"
  },
  [...]
 ]
}

Cómo identificar tu aplicación ante Google

Tu aplicación debe identificarse cada vez que envía una solicitud a la API para desarrolladores de Google Fonts. Para ello, debe incluir una clave de API con cada solicitud.

Adquiere y usa una clave de API

Obtén una clave

O bien crea una en la página Credenciales.

Una vez que tienes una clave de API, puedes usar tu aplicación para adjuntar el parámetro de consulta key=yourAPIKey a todas las URL de solicitud.

La clave de API en las URL se incorpora de manera segura, por lo que no necesita codificación.

Detalles

La respuesta JSON (consulta el ejemplo anterior) se compone de un array llamado “items” que contiene objetos con información sobre cada familia de fuentes.

Un objeto de familia se compone de los siguientes campos:

  • kind: Es el tipo de objeto, un objeto de fuente web.
  • family: Es el nombre de la familia.
  • subconjuntos: Es una lista de secuencias de comandos compatibles con la familia.
  • menu: Es una URL al subconjunto de la familia que solo incluye el nombre de la familia.
  • variants: Los diferentes estilos disponibles para la familia
  • version: Es la versión de la familia de fuentes.
  • axes: Rango del eje, presente solo a pedido(consulta a continuación) para fuentes variables.
  • lastModified: Es la fecha (formato “yyyy-MM-dd”) en la que se modificó la familia de fuentes por última vez.
  • files: Son los archivos de la familia de fuentes (con todas las escrituras compatibles) para cada una de las variantes disponibles.

Si combinas la información de cada familia, es fácil crear una solicitud a la API de Fonts. Por ejemplo, supongamos que tenemos una referencia al objeto de familia para 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('');

[...]

Ordenar

De forma predeterminada, la lista de familias no se muestra en ningún orden en particular. Sin embargo, es posible ordenar la lista con el parámetro de orden:

https://www.googleapis.com/webfonts/v1/webfonts?sort=popularity

Los valores de ordenamiento posibles son los siguientes:

  • alpha: Ordena la lista alfabéticamente.
  • date: Ordena la lista por fecha de adición (la fuente más reciente se agrega o actualiza primero).
  • popularity: Ordena la lista por popularidad (primero la familia más popular).
  • style: Ordena la lista por cantidad de estilos disponibles (la familia con la mayor cantidad de estilos primero).
  • trending: Ordena la lista por familias que ven un aumento en el uso (la familia que ve el mayor crecimiento primero)

Filtros

Cómo consultar una familia específica

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

Todas las familias que admiten el subconjunto griego

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

Filtrar por categoría de fuente

https://www.googleapis.com/webfonts/v1/webfonts?category=category_name

Optimización

Para recuperar archivos de fuentes comprimidos en formato woff2

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

Fuentes variables

Las fuentes variables ofrecen rangos continuos de estilos. De forma predeterminada, se muestra una combinación de archivos de fuentes estáticas para las fuentes variables creadas en instancias en posiciones estándar. Si se establece capability=VF, se muestra el archivo de fuente variable en lugar de los estáticos junto con los metadatos del rango de ejes disponibles. Ejemplo de ejemplo:

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

Respuesta de muestra:

{
 "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
      }
    ]
  },
  [...]
 ]
}

Especificación de la URL de la API

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

your_key: Es tu clave de API de desarrollador.

family: Es el nombre de una familia de fuentes.

subset: Es el nombre de un subconjunto de fuentes.

category: serif | sans-serif | monospace | display | handwriting

capability: VF | WOFF2.

sort: alpha | date | popularity | style | trending.