drnachio/postext

A programmable typesetter for the web.
🌐 Website: postext.dev · 📖 Documentation: postext.dev/en/docs
Postext is a layout engine that bridges the centuries-old craft of print typesetting and the modern web. It takes semantic content — enriched markdown with referenced resources — and applies professional editorial layout rules to produce publication-grade output for HTML, PDF and EPUB.
Built on top of @chenglou/pretext for DOM-free text measurement.
## How It Works
Enriched Markdown Postext engine Output
───────────────── ───────────────────────── ─────────────
┌────────────────────────┐
# Heading │ │ HTML + CSS
Paragraph text... │ 1. Parse & structure │ ┌─► (web rendering)
More text with a ───► │ 2. Measure (pretext) │ ───┤
:ref{id="fig"} and │ 3. Apply layout rules │ └─► PDF
a $formula$. │ 4. Compute geometry │ (print rendering)
│ │
└────────────────────────┘
Configuration files
(columns, rules, spacing)
1. Input. Enriched markdown with referenced resources: images, tables, figures, formulas, pull quotes. The content is semantic, not visual — it describes what to present, not how.
2. Engine. postext parses the content structure, calls pretext for pixel-perfect text measurement without touching the DOM, then runs the layout algorithm: column balancing, resource placement, typographic quality rules, reference systems. All driven by configuration files.
3. Output. Format-agnostic layout geometry — precise coordinates and dimensions for every element. Renderers translate this geometry to the target format: canvas for page images, HTML/CSS for the web, PDF for print, EPUB 3 for e-book readers, and a 3D book in the browser (Folio).
## Why postext?
### The gap between print and web
A professional typesetter — the person who lays out a magazine, a newspaper, or a book — applies dozens of rules that have been refined over centuries:
No orphans (a single line of a paragraph stranded at the top of a column).
No widows (a single line of a paragraph left behind at the bottom).
Balanced columns (roughly equal height across columns on a spread).
Text flowing around figures, pull quotes, and inset images.
Proper placement of footnotes at the bottom of the column where they are referenced.
Margin notes aligned with the paragraph that cites them.
Consistent and deliberate spacing around headings, block quotes, and figures.
Hyphenation that avoids rivers and excessive rag.
CSS gives you almost none of this.
column-count exists but is fragile — there is no control over resource placement within columns, no overflow awareness, and no cross-column orphan/widow prevention. There is no native concept of "flow text around an arbitrarily positioned obstacle." Multi-column editorial layouts on the web remain essentially hand-crafted, usually as static designs that break on different screen sizes.
The web has had responsive layout (flexbox, grid) for over a decade. What it has never had is responsive editorial layout — the kind where content reflows intelligently through columns, around images, past footnotes, obeying the rules that make text pleasant to read.
### A decade of trying
This problem is not new. The Content First project, started around 2014, was an early attempt to bring editorial layout quality to the web. I built column-based layouts, experimented with text flow algorithms, and ran into the same wall repeatedly: you cannot make good layout decisions without knowing exactly how much space text will occupy.