astro-theme-reimu is an Astro blog theme themed after Touhou Project's Hakurei Reimu, providing a complete blogging platform with four-language i18n, seven comment systems, and a set of built-in MDX components.
What is astro-theme-reimu?
astro-theme-reimu is an open-source (MIT-licensed) blog theme built on the Astro framework, created by D-Sketon as a port of their hexo-theme-reimu. It takes Markdown or MDX posts stored in src/content/blog as input and outputs a static blog with pages for archives, categories, tags, about, and RSS. The theme uses TypeScript for configuration (src/config.ts) and supports deployment to GitHub Pages, Vercel, or Netlify. It includes both Astro and React components under src/components.
Key Features
- Full blog functionality — Includes standard blog pages: home, archives, categories, tags, about, and an RSS feed generated via
rss.xml.js. - i18n support — Ships with language files for English, Simplified Chinese, Traditional Chinese, and Japanese, switchable via a
languagesetting. - Code highlighting with Expressive Code — Syntax highlighting with line numbers, code folding via
collapsemarkers, and copy buttons. - Math and diagrams — KaTeX for LaTeX math (inline and block) and Mermaid for flowcharts, both built into Markdown rendering.
- Local search — Fuse.js-based local search that indexes blog content without a server.
- Seven comment systems — Supports Valine, Waline, Twikoo, Gitalk, Giscus, Disqus, and Utterances, each configured in
config.ts. - Analytics and statistics — Integrates Baidu Analytics, Google Analytics, and Microsoft Clarity; reading counts via Waline/Valine and visitor counts via busuanzi.
- Built-in MDX components — Includes Link cards, FriendCard, HeatMapCard, TagRoulette, Tabs, Details, Grid, Gallery with lightbox, and AlertBlockquote (info/warning/danger/tip/important).
- Customization options — Configurable sidebar widgets, menu navigation, responsive banner with srcset, random post covers, share buttons for Weibo/QQ/WeChat, sponsor QR codes, and a firework mouse effect.
Who is it for?
- Anime and gaming bloggers who want a Touhou-themed aesthetic with Reimu visuals and character styling.
- Developers familiar with Astro who need a feature-complete blog without writing components from scratch; all theme options live in one
config.tsfile. - Writers who use Markdown/MDX and need math formulas, diagrams, code blocks with folding, and rich content blocks like tabs and galleries.
- Multilingual content creators who want to publish in English, Chinese, Traditional Chinese, or Japanese using the built-in i18n system.
What can you do with it?
- Touhou fans: launch a personal blog with Reimu-style design, preloader text, and Touhou-themed covers.
- Technical writers: write posts with KaTeX formulas, Mermaid diagrams, and collapsible code blocks, then publish to GitHub Pages or Netlify.
- Site maintainers: choose from seven comment systems and three analytics providers to engage readers and track traffic.
- Content curators: use the built-in Gallery, Link cards, and FriendCard components to create rich MDX pages beyond plain posts.
How does astro-theme-reimu work?
Installation is clone-based: run git clone, then use pnpm install, pnpm dev for development, and pnpm build to generate a static dist/ folder. Content is written as Markdown or MDX files in src/content/blog with a defined Front Matter schema (title, description, pubDate, tags, categories, cover, and more). All site settings—from site metadata to comment system credentials—are edited in src/config.ts, and deployment is handled by connecting the repo to GitHub Pages, Vercel, or Netlify.
FAQ
Is astro-theme-reimu free?
Yes. The theme is released under the MIT License, so it is free to use, modify, and redistribute.
Which comment systems does it support?
It supports seven: Valine, Waline, Twikoo, Gitalk, Giscus, Disqus, and Utterances. Each has its own configuration block in src/config.ts.
Does the theme support dark mode?
Yes, dark mode is a built-in feature alongside responsive layout and image lazy loading.
Can I add a new language?
Yes. Language files live in src/languages (currently en.ts, zh-cn.ts, zh-tw.ts, ja.ts). You can create a new .ts file following the existing structure and set it in the site config.
How do I deploy the theme?
Build with pnpm run build and deploy the dist/ directory to GitHub Pages, or connect the repository to Vercel or Netlify, which auto-detect Astro projects.
