Kanso is a minimal writing theme for Astro that I created. It’s focused on typography, clean reading experience, and accessibility. The name “Kanso” comes from the Japanese concept of simplicity—removing the unnecessary to let the essential shine through.
This very site you’re reading is built with Kanso.
Features
Typography
Kanso uses beautiful, self-hosted fonts served through Astro’s native font system:
- Lora — Display and headings
- PT Serif — Body text
- JetBrains Mono — Code blocks
Fonts are preloaded for optimal performance and include proper fallbacks for each font weight and style.
Content
Kanso is designed for writers with:
- MDX support — Use JSX components in your markdown
- Syntax highlighting — Code blocks with Catppuccin themes
- Image optimization — Automatic WebP conversion and lazy loading
- Full-text search — Powered by Pagefind
- RSS feed — Auto-generated for your readers
Accessibility
Accessibility is a core principle:
- Semantic HTML structure
- ARIA labels and roles
- Skip-to-content links
- Keyboard navigation
- Focus indicators
- Color contrast compliance
Design
The design is intentionally minimal:
- Clean, distraction-free reading
- Thoughtful typography and spacing
- Responsive layout (mobile, tablet, desktop)
- Dark mode support
- Smooth transitions
Technical Details
Kanso is built with:
- Astro 6 — Modern static site generator
- TypeScript — Type safety throughout
- CSS Variables — Theme customization
- Sharp — OG image generation
- Pagefind — Static full-text search
Getting Started
Install Kanso as a starter template:
npm create astro@latest -- --template enkhee-Osiris/kansoOr add it to an existing project by copying the theme files.
This Site Uses Kanso
I built my personal website using Kanso. It includes my writings, tags, search functionality, and an about page—all styled with minimal typography and accessible markup.
Check out the GitHub repository to learn more or contribute.