hypertype

Justified display headlines and the OpenType features almost nobody turns on. No dependencies, paste it into a page.

Get started Install in your AI tool Try the playground GitHub

CSS can justify a paragraph but not a display headline. hypertype makes every line of a heading fill the column the way print does, and turns on the OpenType features (tabular figures, real small caps, fractions) most generated markup skips. About 6 kB, no dependencies, paste it into a page.

The same page, before and after

An editorial layout in a default sans-serif — Plain CSS

The same layout with a justified slab headline and OpenType typography — With hypertype

The slab headline

slab.js measures the words, breaks them into lines, and sizes each line to fill the column. Plain CSS has no way to do this.

The OpenType layer

Tabular, oldstyle, and slashed-zero figures, true small caps, fractions, ligatures, as utility classes that compose.

Paste it inline

No build, no npm, no stylesheet to fetch. One file in a page, which is also the only thing that works in AI tools that won’t run a build.

Also a Claude skill

The kit ships as an Agent Skill too, so AI coding tools pick it up on their own. Use as a skill →

Verify fonts, for real

An optional local MCP server reads OpenType features straight from the served font, so generated CSS turns on features the font actually ships instead of silently failing. Install in one step →

One-file install

Point any AI at INSTALL.md and it sets up the server and skill for your tool, or run npx -y @sceboucher/hypertype install. How →