Chirping Astro is a feature-rich, Chirpy-inspired blog theme for technical writers who want a fast, accessible, statically generated blog without building a theme from scratch.
Built on Astro 7 with Tailwind CSS v4 and daisyUI v5, it combines a polished sidebar layout with a deeply considered set of blogging features — all rendered at build time for near-zero client JavaScript.
Key Features
Content & Authoring
- Markdown and MDX support with Astro Content Collections and Zod-validated frontmatter
- Expressive Code for syntax highlighting with frame titles, copy buttons, line markers, diffs, and collapsible sections
- KaTeX math rendering (opt-in per-page so you don't ship heavy JavaScript everywhere)
- Callout components, autolinked headings, reading time, and a sticky scroll-spy Table of Contents
- Custom Sätteri plugins for native daisyUI alerts and raw HTML rendering
Multilingual (i18n)
- English and French included out of the box, with English at the URL root and French under <code style="color: rgb(215, 186, 125); background-color: rgba(255, 255, 255, 0.1);">/fr/</code>
- Per-post translation pairing via <code style="color: rgb(215, 186, 125); background-color: rgba(255, 255, 255, 0.1);">translationKey</code> frontmatter
- Smart language switcher that hides itself when no translated sibling exists, so readers never hit a dead-end 404
- Locale-aware RSS feeds, sitemap with <code style="color: rgb(215, 186, 125); background-color: rgba(255, 255, 255, 0.1);">hreflang</code> alternates, and search
Search & Comments
- Pagefind static search — modal + dedicated search page, lazy-loaded, locale-filtered, no extra CSS
- Giscus comments synced with the active theme and page locale, per-post overrideable, with a friendly setup guide shown when not yet configured
SEO & Performance
- Automatic OG image generation at build time using Satori + Resvg for posts without a hero image
- Per-locale RSS, canonical URLs, OpenGraph, Twitter card, and sitemap via <code style="color: rgb(215, 186, 125); background-color: rgba(255, 255, 255, 0.1);">@astrojs/sitemap</code>
- Five small client-side islands; the rest is pure static HTML
Theming & Customization
- Custom <code style="color: rgb(215, 186, 125); background-color: rgba(255, 255, 255, 0.1);">chirpy-light</code> / <code style="color: rgb(215, 186, 125); background-color: rgba(255, 255, 255, 0.1);">chirpy-dark</code> daisyUI themes built with OKLCH color tokens
- No-FOUC theme toggle with View Transitions API animation, respecting <code style="color: rgb(215, 186, 125); background-color: rgba(255, 255, 255, 0.1);">prefers-reduced-motion</code>
- Layout sizing, sidebar width, prose column, and brand colors all controlled via CSS custom properties in a single file
- Privacy Policy pages (bilingual templates, toggleable footer link)
Developer Experience
- Bun as the package manager and runtime
- Strict TypeScript, ESLint (zero warnings), Prettier, and Husky pre-commit hooks
- GitHub Actions workflow for GitHub Pages deployment with automatic sub-path handling
- Works on Cloudflare Pages, Netlify, Vercel, and any static host
Getting Started
Use the Starter Template for a clean, deploy-ready base:
bunx create-astro@latest --template kannansuresh/chirping-astro-starter
Or clone the full repo to explore all features with the included demo posts.
Powered by Astro 7 & Sätteri Chirping Astro fully embraces Astro 7's next-generation Rust-based Markdown engine, Sätteri. We've successfully migrated our custom Markdown directives—including our daisyUI <code style="color: rgb(215, 186, 125); background-color: rgba(255, 255, 255, 0.1);">alert</code> blocks and raw HTML (<code style="color: rgb(215, 186, 125); background-color: rgba(255, 255, 255, 0.1);">ashtml</code>) plugins—directly to Sätteri's high-performance architecture.
This means you get the blazing-fast build times of Astro 7's Rust compiler, without sacrificing the rich authoring features, custom components, and SEO enhancements you need for technical writing!
