fontkit

library2.0.4jsnpmunverified

Fontkit is an advanced, cross-platform font engine designed for both Node.js and browser environments, currently stable at version 2.0.4. It offers comprehensive support for numerous font formats, including TrueType, OpenType, WOFF, WOFF2, and TrueType Collections. Its core capabilities encompass accurate character-to-glyph mapping, supporting advanced substitution features like ligatures, alongside robust glyph metrics and layout functionalities such as kerning. The library deeply integrates with OpenType (GSUB, GPOS) and Apple Advanced Typography (AAT) features, providing tools for extracting glyph vector paths for SVG conversion, handling color emoji glyphs (via SBIX and COLR tables), and supporting AAT variation glyphs for dynamic design control. A significant differentiator is its efficient font subsetting mechanism, which enables developers to create optimized font files containing only the necessary glyphs. The 2.0.0 release marked a substantial modernization, migrating from Node.js-specific `Buffer` usage to `Uint8Array` and `TextDecoder`, significantly enhancing its browser compatibility and changing the subset encoding API from streaming to a direct `Uint8Array` return. It is notably used as a core component within the PDFKit library.

serialization data

npm install fontkit

github ↗package ↗

INSTALL

IMPORT

SIG · FONTKIT

fontkit

serializationjavascriptv2.0.4

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

fontkit

✓ import fontkit from 'fontkit';

✗ const fontkit = require('fontkit');

ESM import is preferred in modern Node.js and browser environments. The CommonJS `require` syntax is still supported for older Node.js projects but is less common in new development.

fontkit.openSync

✓ import fontkit from 'fontkit'; const font = fontkit.openSync('path/to/font.ttf');

✗ import { openSync } from 'fontkit';

`openSync` is a method on the default `fontkit` export, not a named export directly from the package. It's used for synchronous font loading, primarily in Node.js environments.

fontkit.create

✓ import fontkit from 'fontkit'; const buffer = new Uint8Array(...); const font = fontkit.create(buffer);

`create` is the primary method for loading fonts from a `Uint8Array` buffer, suitable for both Node.js (e.g., after `fs.readFile`) and browser environments (e.g., after `fetch().arrayBuffer()`).

Demonstrates opening a font, laying out text, extracting SVG paths for individual glyphs, and creating/encoding a font subset, saving it to a new file.

import fontkit from 'fontkit'; import { readFileSync, writeFileSync } from 'fs'; import path from 'path'; // Ensure a font file exists for this example, e.g., 'NotoSans-Regular.ttf' // You can download one from Google Fonts for testing purposes. const fontFilePath = path.join(process.cwd(), 'NotoSans-Regular.ttf'); try { // Open a font synchronously (Node.js environment). // In a browser, you would typically fetch an ArrayBuffer and use fontkit.create(arrayBuffer). const font = fontkit.openSync(fontFilePath); console.log(`Opened font: ${font.fullName} (v${font.version})`); // Layout a string to get glyphs and their positions. const run = font.layout('Hello, fontkit!'); console.log(`Glyphs in "Hello, fontkit!": ${run.glyphs.length}`); // Extract an SVG path for the first glyph. if (run.glyphs.length > 0) { const firstGlyphSVG = run.glyphs[0].path.toSVG(); console.log(`SVG path for first glyph (truncated): ${firstGlyphSVG.substring(0, 50)}...`); } // Create a font subset containing only the glyphs used in the laid-out string. const subset = font.createSubset(); run.glyphs.forEach(glyph => { subset.includeGlyph(glyph); }); // Encode the subset into a Uint8Array. const subsetBuffer = subset.encode(); console.log(`Created subset font with ${subset.glyphs.length} glyphs, size: ${subsetBuffer.byteLength} bytes.`); // Optionally, save the subset to a new file. const subsetFilePath = path.join(process.cwd(), 'subset-font.ttf'); writeFileSync(subsetFilePath, subsetBuffer); console.log(`Subset font saved to ${subsetFilePath}`); } catch (error) { console.error(`An error occurred: ${error.message}`); console.warn("Please ensure a font file (e.g., 'NotoSans-Regular.ttf') exists in your current directory for this example to run."); }

Debug

Known issues

breakingVersion 2.0.0 replaced all internal usages of Node.js `Buffer` with `Uint8Array`/`TextEncoder`/`TextDecoder` for improved browser compatibility. Code directly interacting with internal `Buffer` instances will break.

fix

Migrate any direct `Buffer` manipulations to use `Uint8Array` and `TextEncoder`/`TextDecoder` as appropriate for text encoding/decoding.

affects: >=2.0.0

breakingThe `subset.encodeStream()` method was removed in version 2.0.0. Subset encoding is no longer stream-based; `subset.encode()` now directly returns a `Uint8Array`.

fix

Replace calls to `subset.encodeStream()` with `subset.encode()`. Handle the returned `Uint8Array` directly instead of piping it through a stream.

affects: >=2.0.0

breakingThe optional dependency `iconv-lite` has been dropped in version 2.0.0. `TextDecoder` is now used for character encoding.

fix

Remove `iconv-lite` from your project dependencies if it was only used for `fontkit`. `fontkit` now handles encodings internally using standard Web APIs.

affects: >=2.0.0

gotchaWhile fontkit supports both Node.js and browser environments, the Node.js build includes `fs` (file system) dependencies for `open` and `openSync` methods. Using these methods directly in a browser context will result in errors.

fix

In browser environments, use `fontkit.create(buffer)` with a `Uint8Array` obtained from fetching font data (e.g., `fetch().arrayBuffer()`). Ensure your build process (e.g., Webpack, Rollup) is configured to use the browser-specific build of `fontkit` if it's not automatically picked up.

affects: >=1.0.0

Errors

Common errors & fixes

ReferenceError: Buffer is not defined

Attempting to use `fontkit` v2.x or later in a browser environment or a Node.js context where `Buffer` is not globally available (e.g., an ESM module in some older configurations) and `fontkit` expects it for legacy interop, or custom code using `Buffer` for operations `fontkit` used to handle.

fix

Ensure you are using the browser build of `fontkit` if in the browser. For Node.js, ensure your environment correctly defines `Buffer` or update your code to use `Uint8Array` where `Buffer` was previously expected, especially if migrating from pre-v2 `fontkit` versions.

TypeError: subset.encodeStream is not a function

This error occurs when migrating from `fontkit` v1.x to v2.x. The `encodeStream` method was removed in v2.0.0 in favor of a direct `encode` method.

fix

Replace `subset.encodeStream()` with `subset.encode()`. The new method returns a `Uint8Array` directly, so adjust your subsequent code to handle a `Uint8Array` instead of a stream.

Error: Cannot find module 'fs' or similar file system errors in browser

Attempting to use `fontkit.open()` or `fontkit.openSync()` in a browser environment, which are Node.js-specific methods relying on the `fs` module.

fix

In browser environments, you must load font data as an `ArrayBuffer` (e.g., via `fetch`) and then use `fontkit.create(new Uint8Array(arrayBuffer))` to instantiate the font object.

Upgrade

Version history

2.0.4latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

4 hits · last 30 days

node

Resources

githubhttps://github.com/foliojs/fontkit ↗

packagehttps://www.npmjs.com/package/fontkit ↗