Ops  ⟩  Extension  ⟩  FontKit  ⟩  FontParser

FontParser Op

FontParser

Loads a font file, parses it with fontkit.js, and lays out a text string into individual glyph outlines.


Key features:

  • Loads .ttf , .otf , .woff variable and static fonts
  • Lays out text using fontkit's built-in shaping engine (kerning, ligatures)
  • Outputs one SVG path string per glyph (at origin) + a positions array (x, y, z per glyph)
  • Outputs a combined SVG path (all glyphs positioned) ready for direct use
  • Supports multiline text via \n with configurable Line Height
  • Supports tracking (letterspacing) in normalized units
  • Supports Center Lines toggle for multiline horizontal centering
  • Exposes variable font axes as dynamic input ports (auto-detected from font)
  • All coordinates normalized by 1.0 / unitsPerEm (1 em = 1.0 unit)
  • Outputs font metrics: Width, Height, Ascender, Descender, UnitsPerEm

Outputs used downstream:

Glyph Paths Glyph Positions Font Object → array of SVG path strings (one per glyph, at origin) → flat array [x, y, z, x, y, z, …] → the fontkit font instance (needed by axis animation ops)


Full Name
  • Ops.Extension.FontKit.FontParser
Visibility
  •  Extension Op - visible for everyone
License
  • MIT
AuthorgithubMaintained by TeamDependencies
  • fontkit.min.js (commonjs)



Example Patch Fontkit Glyph Morph Example

Open In Editor

INPUT PORTS


Font File (String)
Text (String)
Tracking (Number)
Line Height (Number)
Center Lines (Number: boolean)
Axis: wght (Weight) (Number)

OUTPUT PORTS


SVG Path (String)
Path Data (Object)
Glyph Paths (Array)
Glyph Positions (Array)
Font Object (Object)
Text Out (String)
Text Width (Number)
Text Height (Number)
Ascender (Number)
Descender (Number)
UnitsPerEm (Number)
Axes (Array)
Tracking Out (Number)

Changelog

Patches using FontParser

  • Examples
  • Public
  • My Patches