Solid geometry on a 32-unit grid so it survives 16px. The lean is the only diagonal in the system; it is what makes the mark read as a hand rather than a generator.
Literata SemiBold, capital T, tracked to −0.03em. Inter is never used for the name: the shell is grey and the brand is the one serif thing in it.
Toread
ToreadHorizontal · app header, docs, email
ToreadStacked · first run, site card
Mark only · favicon, tab, nav, toast
03
Colour
Mineral: limestone, weathered slate, oxidised copper. The chrome is grey; verdigris is the only colour that carries meaning. Where it goes is rule 01 in section 06. Select a swatch to copy its code.
04
Type
Inter for the shell, Literata for the page, JetBrains Mono for values. Three weights, sentence case everywhere. The numbers below are the whole scale; there is nothing else.
DisplayLiterata 400
What the first year taught me56/60 · 36/40 · 30/36 · tracking −0.02em
ReaderLiterata 400
The shelf is the oldest interface we have for things we mean to come back to, and it works because it makes the backlog visible without making it loud.18/30 · tracking 0 · measure 680px
InterfaceInter 400 / 500 / 600
Paste a link or a PDFPaste a link or a PDFPaste a link or a PDF12/16 · 13/18 · 14/20 · 15/22 · 18/26 · tracking 0, −0.01em above 18
Every page ships a 1200×630 card rendered on the edge from the same template: the site card here, and one per saved item.
The site card/og.png
Save something and its card appears here.
06
Using the mark
Five rules. Each one is a picture because each one is about how the mark looks, not about how it is described.
DoDon't
Keep the mark monoInk on white, white on ink, paper ink on paper. The whole mark is never green.
DoDon't
Clear space is one volumeFive thirty-seconds of the mark's width on every side, measured from the shelf rule.
Toread
DoDon't
Mark alone below 120pxThe lockup needs 120px of width; under that, the mark carries the name.
Ready
DoDon't
One green per surfaceVerdigris marks the single most important thing in view: the primary action, the icon's leaning volume, or a card's language line. Never two.
DoDon'tDon't
Never outline, stretch or tintNo strokes, no non-uniform scaling, no mark on a green tint.
07
Voice
A librarian's, not a coach's. It names what happened, offers one next thing, and gets out of the way of the text.
Report, don't cheerSaved to Toread. Ready in about a minute.Awesome! Your article is being processed 🎉
One verb per surfacePaste a linkGet started with your first save now
Name the language, not the modelTranslated into 繁體中文 · original besideAI-powered translation by GPT
Failures say why and what nextFetch failed: the site returned 403. RetryOops, something went wrong. Sorry!