pixel / token forge

Design Token Generator

Build a complete type system. Export it. Stop guessing.

Display / Heading

Body / Reading

Monospace / Code

live preview

The quick brown fox

Paragraph text should be easy to read over long distances. Choose a typeface with open apertures and comfortable x-height. Your body font is doing the real work here — respect it.

const scale = computeTokens(base, ratio);

Space Grotesk / Source Serif 4 / Perfect Fourth / 16px base