Design reference 05 · Clarity & editorial
Scholarly Folio
Support close reading while keeping commentary and sources within reach.
Download design ZIP · Open interactive specimen
Design specification
Philosophy and fit. Support close reading while keeping commentary and sources within reach. Suitable for annotated texts, research essays, translations, archival editions, and educational publications.
Visual grammar. A book-like serif reading column sits between a narrow chapter index and a wider annotation margin. Use parchment-white, dark brown-black text, restrained burgundy links, paragraph numbers, and precise footnote markers. The title treatment resembles a scholarly title page. Notes are connected to passages through labels and alignment rather than colour alone; the navigation distinguishes chapters, annotations, and bibliography.
Specimen and flow. *The Commonplace Edition* contains an original fictional essay with author commentary. Selecting an annotation highlights its passage and reveals the note. Supporting views show the bibliography with source metadata and a reading-only mode that suppresses secondary material.
Adaptation and identity. Mobile brings each opened note into the reading flow with a clear return control. Preserve the relationship between text, notes, and sources; avoid magazine teasers, decorative manuscript imitation, and hover-only notes. Motion is unnecessary. Effort: medium.
Distinctive composition. Serif italic marginal captions reinforce the scholarly folio, separating its reading character from the Knowledge Garden workspace.
Files for a coding model
Reference images
- Desktop — 1440 × 1000 viewport
- Phone — 390 × 844 viewport
- Supporting state — 1440 × 1000 viewport
- Full page — 1440 × 1000 viewport
Supporting routes
Reuse
Use and adapt the original code and specifications for personal or commercial work under MIT. Keep applicable font and photo notices. The ZIP includes the complete runnable reference and its local assets.