Ref 005 · thing · · shipped
og-stamp
Build-time Open Graph images without a headless browser — an SVG template, real fonts, and resvg. This site uses it on every page.
Every page on this site has an Open Graph image that was drawn at build time,
by a script, from the page itself. No headless browser, no image service, no
API key: after the static build, the script walks the generated HTML, reads
each page’s og:title and og:image tags, renders an SVG template with the
site’s actual fonts, and rasterises it with resvg. The pages are the source
of truth, so a page can’t ship with someone else’s card.
The whole thing is one script and one dependency, and it runs in about a
second for the whole site. It ships in this site’s repo — scripts/og-images.mjs —
which is the closest thing it has to a homepage.
Things it deliberately doesn’t do: screenshots of the page (fragile, slow, and the card should be a stamp, not a thumbnail), text wrapping beyond two lines (if a title needs three lines on a card, the title is wrong), and configuration (it has none; change the template).