About the shelf

Every cover is drawn, not photographed

No cover imagery is bundled with this site. Each volume carries its own palette — a cloth colour, a foil accent and an ink tone — plus a motif such as lattice, orbit or circuit. Those values are painted onto a canvas texture at runtime and wrapped around the book’s geometry, so the shelf renders identically on a clean clone with no asset downloads.

Contributor-owned artwork is still supported. Drop an image at public/books/<id>/cover.webp and set coverImage on the catalog entry; if the file is missing, the procedural cover is kept rather than failing the render.

One continuous shelf

Spine widths and heights come from the catalog data, and the books are sorted by height so the silhouette steps down naturally across the shelf. Browsing runs a six-phase motion — retreat, turn, shelve, then extract, turn, settle — and a collision test checks every pair of book footprints throughout that path, so no two volumes ever intersect.

Built to be accessible

The canvas is not the only way through. Arrow keys move along the shelf, Enter inspects the selected volume, and every book is reachable from the tick index below the shelf. Live regions announce the current selection, and the same 17 volumes are available as ordinary HTML pages in the catalog — which is also what search engines and AI crawlers read.

Motion honours prefers-reduced-motion: the idle inspection sway is disabled and transitions collapse when the preference is set.

Technical notes

• Next.js with a fully static export — no server at runtime.
• Three.js for the shelf geometry, lighting and orbit controls.
• Covers generated on a 2D canvas, then used as textures.
• Newsreader and Inter, self-hosted via Fontsource.

Independent open-source project. Not affiliated with or endorsed by Stripe.