@lediv/fonts

Variable web font assets and utilities for Lediv projects. Twenty curated fonts (Inter, Roboto Flex, Playfair Display, JetBrains Mono and more) pre-bundled as WOFF2, with helpers for @font-face generation, preload links, and Vite integration.

You probably want @lediv/vite-plugin. This package is published because the plugin and @lediv/build depend on it, not because it is meant to be used directly.

Entry points

| Import path | Environment | Description | | ------------------- | ----------- | ---------------------------------------------- | | @lediv/fonts | any | Font catalog, CSS helpers, used-font detection | | @lediv/fonts/node | Node.js | Resolves local WOFF2 file paths on disk | | @lediv/fonts/vite | Vite | Dev-server middleware + build output plugin |

Usage

npm install @lediv/fonts

import { CUSTOM_FONTS, getFontById, buildFontFaceCSSAll, getUsedFonts } from '@lediv/fonts';

const css = buildFontFaceCSSAll(getUsedFonts(htmlString));

getUsedFonts scans <style> blocks and inline style attributes for font-family references matching the catalog, so a page only ships the faces it actually uses.

import { serveFonts } from '@lediv/fonts/vite';

export default { plugins: [serveFonts()] };

serveFonts() answers /fonts/:id/latin-wght-normal.woff2 in dev and copies the font files to the output directory on build. That URL shape is what the generated @font-face rules point at, so it has to keep working wherever a built site is served.

The catalog entries, the remaining helpers and the CustomFont shape all ship with type definitions; read those rather than a table here that can go stale.

License

MIT