Design and interface · Edition No. 12 · 6 Sep 2026

fontsource/fontsource

Self-hosted open-source fonts as npm packages, split by weight and subset — including cyrillic.

← Design and interfaceRead the whole edition →

6.1k stars · MIT · core-v0.4.0 (2026-09-06) · Track this in Scout

Self-hosted open-source fonts as npm packages, split by weight and subset — including cyrillic.

▶Repo detailsthe review · specs · pros & cons · install

What it is

Open-source fonts — the Google Fonts catalogue and more — packaged as npm modules you install and serve from your own domain, split by weight and by character subset. You import exactly what you use; nothing is fetched from Google when a visitor loads the page.

What it is good for. Three arguments. First, compliance: loading fonts from Google's CDN transmits every visitor's IP address to Google, which German courts have already found unlawful without consent — so CookieConsent (Ed. 11 #5) would have to block your typography until someone clicks accept, which looks broken. Second, speed: one fewer DNS lookup and connection on every first visit, which is exactly what web-vitals (Ed. 8 #2) exists to measure. Third, and least obvious: the cyrillic subset is a first-class option here, so a Russian-language page gets proper typography instead of the system fallback that quietly makes it look like a different, cheaper website.

Stars6.1k
LicenceMIT
Latestcore-v0.4.0 (2026-09-06)checked 7 Sep 2026
Written inTypeScript
Setup effort
1 / 5
Payoff
4 / 5
Good
  • Removes a third-party request and a legal question in the same thirty minutes.
  • Explicit subsets mean full Cyrillic support without shipping every glyph on earth.
  • Identical usage in Astro and in the React app — one decision, both surfaces.
Watch for
  • You now own font versioning and cache headers, which Google was handling before.
  • Importing the wrong file silently ships a very large font — check what you imported.
  • It is a monorepo tagged per package, so "the latest release" needs reading carefully rather than at a glance.
Install
npm i @fontsource/<family>
Screenshots
fontsource/fontsource: GitHub preview card

Get the next edition in your inbox

A dozen repositories, opened and checked. The licence read, the last release dated, and the ones that did not make it named with the reason. It is the half most lists leave out.

No tracking pixels. One click to leave. The archive stays free either way.

We use your address to send the edition and nothing else. Confirm by email, leave in one click. How we handle it.