About

A personal reference library for design work: tools, articles, snippets, and notes, with the connections between them made visible. One JSON file, two views of it — a shelf and a brain.

Inspiration

• Andy Matuschak's working notes — experimental presentation; stacked note panels; publishing rough notes publicly.
• Quartz — the connected-node graph view; Obsidian-style backlinks on the web.
• Forked My Brain (Nicole van der Hoeven) — a live Obsidian Publish garden with graph view, organized for an outside reader.
• bookmarks.design — the traditional view; curated designer resources in a clean categorized grid.
• Tom Critchlow's wiki — simple sidebar wiki structure; the /canon idea of a short list of things you return to.
• frontend-dev-bookmarks (dypsilon) — category taxonomy for frontend resources, flattened here to one level plus tags.
• Maggie Appleton's garden — growth-stage metadata (seedling, growing, evergreen) and the idea of a garden that changes over time.

Colophon

The site is built from its own entries. The type scale is the fluid type scale with clamp() snippet. The focus rings are focus styles that pass review. The theme switch is theme toggle with system preference. The graph physics honor reduced motion handling, and the skip link uses the visually hidden utility. If a snippet in the library stops being good enough for the library, it gets revised.

Type: Bricolage Grotesque for display, Atkinson Hyperlegible — designed by the Braille Institute for low-vision legibility — for body text, JetBrains Mono for code. All self-hosted, all open licensed (SIL OFL).

Stack: one JSON file, plain HTML, CSS, and JavaScript. D3 runs the force simulation; marked renders the note bodies. No framework, no build step, no tracking.

Colors are defined in OKLCH as lightness steps with role-based names, which is rule one and rule four of the library's own color in UI note. Every text and background pair was checked programmatically against WCAG 2.2 AA before shipping.