Fontsource vs onlyfonts
Fontsource packages Google Fonts as npm modules for self-hosting — a great workflow if you have a bundler. onlyfonts is CDN-first: one link tag, no build step, plus semantic search and pairing intelligence Fontsource doesn't attempt. Fontsource is the more mature choice for npm-based self-hosting today; onlyfonts is the better way to find fonts and the simpler way to serve them.
side by side
| Fontsource | onlyfonts | |
|---|---|---|
| distribution | npm packages (self-host via bundler) | CDN link tag; TTF/woff2 downloads for self-hosting |
| requires build tooling | yes | no |
| search | keyword (Algolia) | semantic + image identification |
| pairing / classification | none | scored pairings, mood/era/formality tags |
| metadata | basic (weights, subsets, axes) | OpenType features, language validation, quality metrics, character maps |
| catalog | ~2,000 families, ~95% Google Fonts | 2,600+ incl. non-Google sources |
| update cadence | weekly cron from upstream | on-demand pipeline |
| price | free (MIT) | free |
pick Fontsource if
- you want fonts bundled into your build and served from your own origin via npm
- you rely on their years of versioned releases and framework guides
pick onlyfonts if
- you want a link tag that works without a bundler or build step
- you want to discover fonts semantically or identify one from a screenshot
- you want pairing suggestions and font metadata (OpenType features, language coverage, quality metrics) with your font
questions
Can I self-host onlyfonts fonts like Fontsource?
Yes — every font page has TTF downloads and the CDN file URLs are stable and mirrorable. There are no @onlyfonts npm packages yet; if you specifically want npm-based font management today, Fontsource is the mature option.
Why use a CDN instead of self-hosting?
Self-hosting is great when you have a build pipeline. The CDN works everywhere else: static sites, CMSs, prototypes, generated sites — and ships unicode-range subsets per visitor without configuration.
try it
search the catalog by description or screenshot, or read getting started — loading a font takes one link tag.