Framework agnostic tools for accessing data from font CDNs and providers.
📖 Documentation · 🔍 Catalogue · ⚖️ Compare providers · 🧩 HTTP API
Every font CDN is reached a different way. Google returns a stylesheet you have to parse, Fontshare
returns JSON with its own names for weights, and Adobe wants a project id. unifont is one layer
over all of them: ask for a family, and get back weights, styles, subsets, unicode ranges and
@font-face data in the same shape every time.
npm i unifont
pnpm add unifont
yarn add unifontThis package is ESM-only.
import { createUnifont, providers } from 'unifont'
const unifont = await createUnifont([
providers.google(),
providers.fontshare(),
])
const availableFonts = await unifont.listFonts()
const properties = await unifont.getFontProperties('Poppins')
const { fonts, fallbacks } = await unifont.resolveFont('Poppins', {
weights: ['400', '700'],
subsets: ['latin'],
})Providers are tried in order, and the first one that knows the family answers.
Getting started walks through it. The API reference has every option and signature.
providers.google()
providers.bunny()
providers.fontshare()
providers.fontsource()
providers.googleicons()
providers.npm()
providers.adobe({ id: process.env.TYPEKIT_ID })Providers covers what each one serves and the options it takes. You can also write your own.
In a browser or a web container, CORS blocks every provider API except npm, so unifont sends
those requests through a proxy instead. See
Browser and web containers.
Warning
The default https://proxy.unifont.dev is experimental and not for production use. It's there
so reproductions and playgrounds work in web containers like StackBlitz without anyone deploying
anything first. It's best-effort, it may be rate-limited, and it may change or disappear without
notice. For anything else, deploy proxy/ and point apiBase at it.
- Clone this repository
- Enable Corepack using
corepack enable - Install dependencies using
pnpm install - Run interactive tests using
pnpm dev
unifont.dev lives in docs/. It's a Nuxt app that runs on the
built package, so run pnpm build before pnpm docs. Its prose is Markdown in
docs/content, served through Comark Content.
Everything else comes from unifont at request time.
Made with ❤️
Published under MIT License.