Colophon

Blogbox is a small editorial operation that puts more thought than is strictly warranted into the way each piece is set on the page. This colophon records the specific decisions, for reference and for anyone who might run a similar publication and wonders what we chose.

Type

The display and headline face is Fraunces, drawn by Phaedra Charles and Flavia Zimbardi, a contemporary serif with an optical-sizing axis that keeps display settings crisp and body settings comfortable.

The body face is Inter, drawn by Rasmus Andersson, for its Australian screen legibility and its opsz axis, which we run at auto for size-appropriate stroke weight.

Metadata, captions, and bylines are set in JetBrains Mono, weighted 500, letter-spaced 0.12em where they appear in small caps.

All three are loaded self-hosted (woff2, latin subset) via the @fontsource-variable packages. No Google Fonts request leaves the browser.

Colour

A warm near-black on a warm off-white paper. The ink is #0a0a0a, the paper is #fafaf7. The single editorial accent is a rust #b8441f in light mode and #e46a3e in dark. All colour tokens flip via the CSS light-dark() function; there is exactly one palette, defined once.

Contrast has been verified against WCAG 2.2 AA for every small-text combination in the design system.

Grid

A 12-column desktop grid with a centred 42rem reading measure. Feature articles escape the measure with a full-bleed hero and a floating margin-note column at 1180 pixels and above.

Motion

We use View Transitions for route-to-route morphs, scroll-linked reveals for below-fold content, and a one-shot letter rise on feature H1s, all governed by prefers-reduced-motion. No animation runs for readers who have asked for none.

Stack

Astro 5 for the static build. Tailwind v4 for utility CSS over a small set of editorial tokens. Pagefind for search. Satori with resvg-js for per-post OG images. MDX for the editorial components (pull quotes, stat callouts, side notes, business mentions, feature cards). No client-side framework, no bundler for the body of the site. The generated JavaScript total across an article page is under ten kilobytes.

Hosting

Cloudflare Pages. One static deploy per push to main. Per-branch preview deployments for every pull request. Domain served from Cloudflare with automatic SSL.

Analytics

Cloudflare Web Analytics. Cookie-free. No third-party tracking. No newsletter lead-magnet overlay. We did not enjoy those on the sites we read, and so we declined to put one on the site we made.

Corrections

Factual corrections are noted at the foot of the affected article and in a running log. Substantive revisions get a new published date. We try not to silently edit pieces after they ship.

People

The writers are listed on our writers page. Design and engineering were led in-house with the aid of the AI assistant the industry is in the middle of working out how to use without abusing. We disclose AI-assisted drafting on pieces where it was materially used, per our editorial policy.

Feedback

If anything on the site reads poorly, sets badly, or is simply wrong, please tell us at hello@blogbox.com.au. Craft notes are as welcome as factual corrections.