Skip to content
yCENzh edited this page Sep 19, 2026 · 1 revision

Shirone

An Astro blog theme you install from npm. Material 3 Expressive on the front, Svelte islands where they earn their place, and a markdown pipeline that handles series, encryption, permalinks and LLM-friendly plain-text mirrors without you wiring any of it up.

The whole theme ships as one package. Your project holds your config, your content and the components you chose to replace — nothing else. Routes, layouts, styles and the markdown processor all come from the package, injected at config time.

mkdir my-blog
cd my-blog
npx shirones init
pnpm dev

That is genuinely the whole setup. init works from an empty directory: it writes package.json, scaffolds the config and example content, then installs Astro, the theme and its peers for you.

Requires Node 22.12 or newer and pnpm. See Getting started for what happens under the hood and what to do if you use npm or yarn instead.

Where to go next

Setting up

Day to day

  • Configuration — the modules under shirones/config/
  • Content — posts, moments, spec pages, series, frontmatter reference
  • Fonts — subsetting, remote playlist text, size budgets

Customising

Maintaining

  • Updating — upgrading the package, drift reports, backups
  • Troubleshooting — the failures worth knowing about in advance

Under the hood

  • How it works — the Astro integration, the override registry, why there is an esbuild in there

Two things worth knowing early

Everything is overridable, and overriding is just a file. Drop src/components/atoms/blog/PostCard.astro into your project and the theme's copy stops being used. No registration, no config entry. Delete your file and the theme's comes back.

Config modules shadow by filename. A file at shirones/config/siteConfig.ts replaces the theme's siteConfig wholesale — it is not merged field by field. That is deliberate: partial merges make it impossible to tell where a value came from. Copy the default, edit what you need, and npx shirones init will tell you later if the theme added fields you are missing.

License

MIT.

Clone this wiki locally