Ravel
A flowing editorial grid built on generous whitespace and deliberate rhythm. Ravel pairs serif headings with airy line heights to guide the eye through long-form content without fatigue.
Locally Lost
Locally Lost is a working notebook for layout experiments, theme architecture, and the kind of design decisions that only surface after you have shipped a dozen projects and broken things in production. This is not a portfolio — it is a pattern library with opinions, built from years of testing WordPress themes, static site generators, and the grey areas between them.
What you will find here: demo layouts dissected down to their grid math and spacing logic, practical guides that skip the theory-only approach, and field notes from real builds. Every demo has been stress-tested with actual content, not lorem ipsum. The guides focus on problems we have hit repeatedly — semantic markup that screen readers actually parse correctly, type scales that hold up on mobile, caching strategies that do not fight your deploy pipeline.
Whether you are a theme author trying to debug a column collapse, a site owner evaluating layout options, or a designer shipping landing pages under deadline, the material here is meant to save you time and spare you the mistakes we already made.
Demo Layouts
View all demos →Chun
Bold asymmetric columns with strong vertical rhythm. Chun uses weight contrast and tight margins to create visual tension that keeps readers anchored in dense material.
Saga
A long-form storytelling layout designed around immersive reading flow. Saga pushes content width wider than typical blogs, using pull quotes and section breaks to pace the narrative.
Stargazer
Dark-canvas layout with cinematic proportions and carefully tuned contrast. Stargazer treats negative space as a first-class design element.
Retro Fitted
Vintage-inspired grid with structured columns and ruled dividers. Retro Fitted borrows from broadsheet newspaper layouts and adapts them for screens.
Picturesque
Image-forward layout where the visual hierarchy leads with photography. Picturesque balances large hero images with tight supporting text blocks.
Guides
All guides →WordPress Theme Structure
A structural guide to WordPress theme architecture — template hierarchy, theme.json configuration, block patterns, and the organisational decisions that determine whether a theme is maintainable or a liability.
Cache and Performance
Practical caching strategies and performance optimisation for static sites — asset fingerprinting, CDN cache headers, image optimisation, and the measurement practices that separate fast sites from slow ones.
SVG and UI Icons
A practical guide to implementing SVG icons in web interfaces — inline vs sprite sheets, accessibility patterns, sizing systems, and the performance tradeoffs of different icon delivery methods.
Typography and Readability
Practical typography guidance for web layouts — type scale, line length, vertical rhythm, font pairing, and the readability decisions that separate professional work from amateur output.
Semantic HTML Layouts
A practical guide to building page layouts with semantic HTML elements — how proper document structure improves accessibility, maintainability, and search engine comprehension.
Recent Notes
All notes →Dancing in the Moonlight
A moment of spontaneity, rhythm, and the spaces where memory lives.
Upcycled Clothing: Environmental and Economic Benefits
Why giving garments a second life matters more than fast fashion wants you to think.
Lost Judgment — New Trailer
Breaking down the cinematic direction and gameplay reveals from the latest trailer.