appliedbits

Colophon

About the making of this site — the typography, the marks, the choices, and the directions considered along the way.

A colophon is, by tradition, a note at the end of a book describing how it was made — the typefaces, the paper, the printer, sometimes the person who set the type. The word comes from the Greek for summit or finishing touch. This page is the colophon for appliedbits: a record of the craft decisions behind how the site looks, with some honesty about the directions I considered and rejected before settling on what's here.

The wordmark

The wordmark appliedbits is set in IBM Plex Sans Medium with a single typographic intervention: the dots over the two i's are replaced with small squares, geometric and the same width as the stem of the letter. The change is small enough to read as natural at first glance and deliberate on second look — a single visual cue that this is set type, not a system font picked at random. Lowercase throughout, no spaces, no hyphens. One word, three letters of identity.

The choice of Plex Sans is not casual. IBM commissioned the family from Bold Monday in 2017 as a corporate typeface intended to feel "engineered, but warm." That balance — technical precision with a human edge — is exactly the register I want this site to occupy.

The mark

The companion mark is a circle frame containing three uniform horizontal stripes, locked at a 100×100 viewBox with the stripes set at consistent 11-pixel widths. Internally I refer to it as L·1, which is just a working name; readers shouldn't need to know that to recognize it. The mark squares-rhyme with the i-dots in the wordmark — the geometric square is the visual unit that ties the two parts of the identity together.

That mark was not the first direction I tried. Earlier in the design exploration I spent real time on a letterpress and woodcut aesthetic — the kind of organic, textured mark that comes from physical printing technique. I have a letterpress, and the visual language of late nineteenth-century technical broadsides is something I love.

Looking at the letterpress direction in earnest, I came to a clear judgment: it was too detailed, too referential, too much of a costume. The site I'm building is not a recreation of nineteenth-century printing — it's a working notebook for technical and standards work happening now. The letterpress aesthetic was telling a story I didn't actually want to tell. I rejected it and went toward the geometric mark instead, which carries the precision the work deserves without dressing it up in someone else's century.

Typography

The site uses three typefaces, each with a specific job:

IBM Plex Sans sets the wordmark, headings, navigation, and any UI-like text. Sans-serif, modern, technically precise. This is the typeface that sets the engineering register.

Source Serif 4 sets the body text — long-form reading, notebook entries, library content, this very paragraph. Source Serif is Adobe's open-source serif, designed by Frank Grießhammer for sustained reading on screen. The italic is particularly fine. I chose it over more obvious choices (Iowan Old Style, Charter, Tiempos) because it pairs cleanly with Plex Sans without competing for attention.

JetBrains Mono sets code blocks, document apparatus, metadata, dates, and small all-caps labels. The default monospace I'd reach for is something more austere — IBM Plex Mono, or even SF Mono — but JetBrains Mono has an unusual personality (slightly tall, slightly open) that gives the technical apparatus on the site a small amount of warmth. The site is full of dates, RFC numbers, and document IDs; they might as well be set in something that's pleasant to look at.

All three typefaces are self-hosted in /site/fonts/ rather than loaded from Google Fonts or Adobe Fonts. The pages load faster, no third party tracks readers, and the typography won't break if a CDN goes away.

Color

The base palette is small and deliberate. The page background is paper-50, a warm cream — a literal reference to the engineer's notebook the site takes its visual metaphor from. The body text is ink-950, a near-black with a brown undertone that softens the contrast against the cream. The accent color, used sparingly on links and small flourishes, is press-600, a deep vermilion red that nods to the press-checked pages of mid-century technical reports.

That last color does not appear on the mark. The L·1 mark is set in the same ink-black as the body type, not in the accent. The decision was deliberate: a colored mark would compete with the typographic identity for attention, and the mark's job is to support the wordmark, not eclipse it.

The build

This site is generated by a small Python script (tools/build.py) that reads markdown files from /content/, parses YAML frontmatter, applies Jinja2 templates, and writes static HTML to /site/. There is no server framework, no database, no content management system. The output is pure static HTML, CSS, and SVG — nothing that requires JavaScript to render.

The site is hosted on Cloudflare Pages, with two parallel Pages projects pointing at the same git repository: appliedbits.com serving the public site, and staging.appliedbits.com serving a build that includes content not yet promoted to public. Drafts live on disk as .draft.md files alongside their canonical siblings; promoting a draft to public is a single command that archives the previous canonical, swaps the draft into place, and rebuilds.

Deliberately absent: no analytics, no trackers, no advertising, no fingerprinting. Server logs at the CDN are the only record of who reads what here, and I don't analyze them. If you're reading this, I don't know who you are, and I prefer it that way.

Credits and thanks

The IBM Plex family was designed by Mike Abbink and Bold Monday and is released under the SIL Open Font License. Source Serif 4 is by Frank Grießhammer at Adobe Type, also OFL. JetBrains Mono is by Philipp Nurullin and Konstantin Bulenkov at JetBrains, also OFL. The site would not look the way it does without their work, and the open licensing that lets it be used here.

The decision-making, the iteration, the wrong directions tried and abandoned — those happened in long working sessions with Claude (Anthropic), which served as a thinking partner and editorial pushback. The judgment calls are mine; the patient engagement with my second- guessing belongs to the assistant. Mentioning this feels honest. The site was made the way many things are made now — by a person and an AI working through the question together.

Last updated 2026.