Foundation Fonts Pack

Three variable fonts covering every functional role in a UI or content site. One file per role — no multi-weight loading.

Type	Font pack (theme tokens only, no JS)
Theme CSS	`packs/fonts-foundation.theme.css`
Total weight	~660KB (Latin subset, 5 woff2 files)

Fonts Included

Inter — UI & Interface

Designed for screen rendering. Axes: wght (100–900), opsz (14–32), slnt (−10–0). Assigns to --font-sans.

Key OpenType features: tabular numerals (tnum), slashed zero (zero), disambiguation alternates (ss01–ss04).

Literata — Editorial & Long-form

Commissioned by Google Books for long-form reading. Axes: wght (200–900), opsz (7–72). Assigns to --font-serif.

Key OpenType features: oldstyle numerals (onum), real small caps (smcp), discretionary ligatures (dlig).

Recursive — Code & Casual UI

Single font covering both proportional sans and monospace via the MONO axis. Axes: wght (300–1000), MONO (0–1), CASL (0–1), slnt (−15–0). Assigns to --font-mono.

Loading

import { activateBundle } from 'vanilla-breeze'; await activateBundle('fonts-foundation');

The pack sets --font-sans, --font-serif, and --font-mono. All existing components and themes pick these up automatically.

Theme Interaction

Font packs write to @layer tokens. Themes write to @layer bundle-theme, which has higher cascade priority. This means themes always win — for example, the Terminal theme's VT323 will still override --font-mono even when this pack is loaded.

OpenType Utility Classes

The foundation pack also adds OpenType utility classes (imported via extensions/opentype.css):

Class	Effect	Best for
`.vb-tabular`	Tabular (fixed-width) numerals	Tables, counters, prices
`.vb-oldstyle`	Oldstyle (lowercase) figures	Body prose
`.vb-small-caps`	Real small capitals	Abbreviations, acronyms
`.vb-fractions`	Diagonal fractions	Recipes, measurements
`.vb-slashed-zero`	Slashed zero	Code, data contexts
`.vb-ligatures`	Discretionary ligatures	Display, editorial
`.vb-swash`	Swash alternates	Pull quotes, drop caps

Classes compose: <table class="vb-tabular vb-slashed-zero">

Variable Font Axes

Custom properties for per-font axis control:

Property	Default	Range
`--vb-font-opsz`	16	Font-dependent
`--vb-recursive-mono`	1	0–1
`--vb-recursive-casl`	0	0–1