Inkwell Article Sample

Principles

Inkwell keeps the system quiet so content and workflow state carry the page. It favors editorial headings, understated surfaces, and a single accent color. The rules are few, the consequences are visible everywhere — a typographic system that asks restraint of every page it builds.

Use --paper for panels, --ivory for the page, and --accent only where users need a strong interaction cue. Anywhere a second hue is needed, reach for --olive or --sky — never a second saturated brand color.

The system's restraint should live in color and border, not in headline weight.

Rule

If a value exists in inkwell-tokens.css, reference the token instead of hardcoding a matching color or spacing value.

Application

Long-form pages should use narrow reading widths, generous section spacing, and links with the built-in Inkwell underline style. The editorial primitives — drop caps, pull quotes, bylines, captioned figures — only land when the surrounding page gives them room to breathe.

The accent and olive tints under the same 1.5-pixel frame. The border is what makes them feel like a pair instead of two unrelated swatches — a small example of why hairlines do more work than they look like they should.

Use this layout for technical essays, post-mortems, and design notes. Pair the editorial primitives with .card, .tldr, and the table-of-contents pill list on the right for navigation.