In this starter, that mostly comes down to two decisions:

Palette choice changes tone fast #

Ember feels warm and familiar. Surf feels cooler and more technical. Mint feels a little more zine-like and homegrown.

The layout should stay recognizable even when the color story changes.

Sidebars should be optional #

Not every page needs a second column. Standalone pages now render full width by default, and only create a sidebar when the page front matter explicitly asks for it.

---
layout: layouts/page.njk
title: Notes
sidebarTitle: links.txt
sidebar: |
  - Add any supporting links here
  - Or leave both fields out for a full-width page
---

The goal is to make layout choices feel intentional rather than inherited by accident.

Eleventy handles the publishing flow. WebC gives us reusable little interface chunks. is-land keeps optional JavaScript from becoming a tax on every page view. eleventy-plugin-og-image makes social cards part of the build instead of a separate design chore.

I also wanted a setup that feels open to tinkering:

1. Markdown posts should stay first-class.
2. Tag URLs should stay clean and predictable.
3. Feeds should exist automatically.
4. Accessibility checks should fit into the normal workflow.

That combination is more interesting to me than a theme that looks polished in screenshots but feels brittle the moment you try to make it your own.

---
title: A New Entry
description: This file lives in src/posts/
postSidebar: false
tags:
  - post
  - eleventy
---

That postSidebar: false flag is small, but it is the kind of thing that makes a starter feel considerate to edit.

Here are a few more examples from the kinds of files this starter is made of:

import EleventyFetch from "@11ty/eleventy-fetch";

const data = await EleventyFetch("https://registry.npmjs.org/@11ty/eleventy/latest", {
  duration: "1d",
  type: "json"
});

<nav class="accent-picker" aria-label="Switch the accent palette">
  <a href="?theme=ember">ember</a>
  <a href="?theme=surf">surf</a>
  <a href="?theme=mint">mint</a>
</nav>

.author-panel {
  border: 2px solid var(--color-line);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), var(--accent-soft));
}

npm install
npm run start

For this theme, that means:

Keep the nostalgia structural #

Window chrome, badge walls, and status strips create atmosphere. The actual reading surface still needs to be calm.

Let accessibility be part of the style #

Visible focus rings, roomy line-height, and strong color contrast are not “modern compromises.” They are what let the weird parts stay charming instead of exhausting.

If the visual joke makes the page harder to use, the joke has overstayed its welcome.

Make customization obvious #

If somebody opens this starter and can instantly find the site data, post content, and panel components, the design becomes an invitation instead of a trap.

That is still the energy I want in a modern personal site:

• readable HTML and markdown
• a feed somebody can subscribe to
• URLs that can survive a redesign
• enough structure to publish often without turning the site into a product

My baseline checklist #

If a theme claims to support the small web, I want to see a few boring, practical things working before I care about the screenshots:

• a feed
• clean permalinks
• an about page that can be edited without ceremony
• posts that are still readable after the decorative pieces are stripped away

The IndieWeb ethos helps because it asks practical questions. Can I own the URL? Can I move hosts without losing myself? Can other people follow this site without an account?

READ THE FEED

That little button is a shortcode, and this whole post is plain markdown. The fancy bits should stay optional.