Leader is an Astro theme for a maker with several small products. It is a contents page for a workshop: one ruled row per thing you ship, a hairline running from the name out to its category the way a printed table of contents joins a title to its page number, and the notes you kept while building it filed under the same colour.
How it reads
- The leader rule is the whole theme. On hover it thickens into the category's colour and takes the title with it. The shelf, the notes list and the category pages are all that one row
- Colour means one thing: four categories, one accent each, carried from the row to the product page to every note filed underneath. Nothing else on the page is coloured, so the right-hand edge reads as a column of groups rather than a wall of cards
- No key images. The theme is set in type and rules and is finished before you have taken a screenshot or found a photograph
- Hanken Grotesk for the page, DM Mono for dates, years and counts — numbers that have to line up are set in the mono face
- Nothing is rounded, nothing glows: the radius is 0 and the shape language is a rule. A layout that holds down to 360px
- Dark mode in light-dark() pairs, one switcher, no second palette. Contrast is measured rather than eyeballed — a script fails the build on any pair below WCAG AA
What's included
- Screens: home, the shelf, a product page, notes with pagination, a note, category pages, about, contact, privacy, terms, 404 and the feed
- Type-safe content collections for products and notes, in MDX or Markdown, checked at build time. Files can sit in folders, so dated addresses survive a move
- Eight sample products and fourteen sample notes, including a long illustrated one — the figure is an inlined SVG in the theme's own tokens, so it follows the palette into dark mode
- Meta, Open Graph, JSON-LD, RSS, sitemap, robots.txt, and an analytics slot (Plausible, GA4, Umami)
- Astro 7, Tailwind CSS v4, static output, no client-side framework. A Lighthouse gate in CI
- AGENTS.md, a map of the edit points for Claude Code and Cursor
- MIT, with one footer credit line that is easy to remove
Leader Pro adds what a shelf needs once there is more than one way in: tags that cross categories, series, author pages and a year-by-year archive, Pagefind search and filters on the shelf, a contents rail and related notes, a changelog per product, editions with prices and a gallery view for a shelf that sells, four colour presets and three font pairings, and a share card drawn for every product and note at build time. See it running at leader.ondelva.com.
