API para desarrolladores

La API de Developer brinda acceso a los metadatos de todas las familias que entrega Google Fonts. Permite que las apps consulten a Google Fonts para conocer 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 adición, por número de estilos, por tendencia o por popularidad.

Público

Este documento está dirigido a desarrolladores web y de aplicaciones. Para usar la API de Developer, es necesario conocer 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

Una muestra del resultado tendría el siguiente aspecto:

{
 "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 en Google

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

Adquiere y usa una clave de API

Obtén una clave

También puedes crear 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:

  • tipo: el tipo de objeto, un objeto de fuente para sitios web
  • familia: El nombre de la familia
  • subconjuntos: Una lista de secuencias de comandos compatibles con la familia
  • menú: Es una URL al subconjunto de la familia que abarca solo el nombre de la familia.
  • variantes: los diferentes estilos disponibles para la familia
  • versión: La versión de la familia de fuentes.
  • axes: Rango de ejes, solo presente a pedido(ver a continuación) para fuentes variables.
  • lastModified: Es la fecha (formato "aaaa-MM-dd") en la que se modificó la familia de fuentes por última vez.
  • Archivos de la familia de fuentes (con todas las secuencias de comandos 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, suponiendo que tenemos una referencia al objeto de familia de Anónimo 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('');

[...]

Ordena

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

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

Los posibles valores de ordenación son los siguientes:

  • alpha: Ordena la lista alfabéticamente.
  • date: Ordena la lista por fecha de adición (la fuente más reciente se agregó o actualizó primero).
  • popularidad: Ordenar la lista por popularidad (la familia más popular primero)
  • style: Ordena la lista por cantidad de estilos disponibles (la familia que da prioridad a la mayoría de los estilos)
  • Tendencias: Ordena la lista según las familias que presentan un crecimiento en el uso (las familias que registran 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

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 cuya instancia se creó en posiciones estándar. Si se configura capability=VF, se muestra el archivo de fuentes variables en lugar de estáticos junto con los metadatos del rango de ejes disponibles. Ejemplo de muestra:

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 la clave de API de tu desarrollador.

family: Es el nombre de una familia de fuentes.

subset: Es el nombre de un subconjunto de fuentes.

capability: VF | WOFF2.

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