Side Project - Google Fonts Into Handy JSON Files With CDN

If you've ever built a font picker, a typography component, or anything that lets users choose from Google Fonts, you've probably run into the same problem: there's no clean way to get a list of what's available without hitting their API.

So I fixed that.

Github link - https://hasinhayder.github.io/google-fonts/

I took the entire Google Fonts catalog - every family, every variant, every supported script - and flattened it into a structured set of JSON files. No API keys. No rate limits. Just a folder full of JSON you can clone, curl, or load directly from a CDN in your projects.

Here's how it's organized:

.
├── fonts.json                          → all font families
├── categories.json                     → all categories
├── subsets.json                        → all subsets
├── fonts/
│   └── inter.json                      → per-font metadata
│   └── ...                             → 1,900+ more
├── categories/
│   ├── display/
│   │   ├── fonts.json                  → all display fonts
│   │   ├── subsets.json                → all subsets in display
│   │   ├── latin/
│   │   │   └── fonts.json              → display + latin
│   │   └── ...                         → 40+ more subsets
│   ├── handwriting/
│   ├── monospace/
│   ├── sans-serif/
│   └── serif/
└── subsets/
    ├── latin/
    │   ├── fonts.json                  → all fonts with Latin script
    │   └── categories.json             → which categories include Latin
    └── ...                             → 180+ more subsets

Every single file is available over jsDelivr's CDN, Here are some examples.

# jsDelivr Page
https://www.jsdelivr.com/package/gh/hasinhayder/google-fonts

# jsDelivr CDN root
https://cdn.jsdelivr.net/gh/hasinhayder/google-fonts/

# Every font family, sorted
https://cdn.jsdelivr.net/gh/hasinhayder/google-fonts/fonts.json

# All sans-serif fonts with latin support
https://cdn.jsdelivr.net/gh/hasinhayder/google-fonts/categories/sans-serif/latin/fonts.json

# All fonts that include Arabic script
https://cdn.jsdelivr.net/gh/hasinhayder/google-fonts/subsets/arabic/fonts.json

# Full metadata for Inter
https://cdn.jsdelivr.net/gh/hasinhayder/google-fonts/fonts/inter.json

And in your code, it's just a fetch away:

const res = await fetch(
  "https://cdn.jsdelivr.net/gh/hasinhayder/google-fonts/subsets/latin/display/fonts.json"
);
const { fonts } = await res.json();
// ["ABeeZee", "Aboreto", "Abril Fatface", ...]

That's it. No API keys. No rate limits. Just a URL that returns JSON.

I built this because I was tired of treating font data as something you have to fetch at runtime. Fonts don't change that often. The data is small. It should live at the edge, in your bundle, or on a CDN - and should be easily accessible.

It's here: Google Fonts Project - Github

What are you going to build with it? Let me know in the comments.