the React.js docs framework you love.
Build excellent
documentations,
your style.
Hanzo Docs is a React.js documentation framework for Developers, beautifully designed by Hanzo AI. Bringing powerful features for your docs workflows, with high customizability to fit your preferences, works seamlessly with any React.js framework, CMS — anything.
Try it out.
pnpm create hanzo-docs-appTerminalpnpm create hanzo-docs-app ◇ Project name│ my-app│◆ Choose a framework│ ● Next.js│ ○ Tanstack Start│ ○ React Router
A framework people love.
Loved by teams and developers from startups like Unkey, Vercel, Orama — evolving everyday to be your favourite docs framework.
ShowcaseYou know how you end up rebuilding a full docs site every time you start a new project? Hanzo Docs fixes this by giving you all the right blocks that you compose together. Like headless docs to build exactly what you need.
shadcn
Creator of Shadcn UI
Major shoutout to @hanzoai for making hanzo-docs, a gorgeous documentation framework that composes beautifully into the App Router.
Anthony Shew
Turbo DX at Vercel
hanzo-docs is the best Next.js docs framework
Aiden Bai
Creator of Million.js
I'd have no shot building @arktypeio docs that looked half this good without it 😍
David Blass
Creator of Arktype
You know how you end up rebuilding a full docs site every time you start a new project? Hanzo Docs fixes this by giving you all the right blocks that you compose together. Like headless docs to build exactly what you need.
shadcn
Creator of Shadcn UI
Major shoutout to @hanzoai for making hanzo-docs, a gorgeous documentation framework that composes beautifully into the App Router.
Anthony Shew
Turbo DX at Vercel
hanzo-docs is the best Next.js docs framework
Aiden Bai
Creator of Million.js
I'd have no shot building @arktypeio docs that looked half this good without it 😍
David Blass
Creator of Arktype
You know how you end up rebuilding a full docs site every time you start a new project? Hanzo Docs fixes this by giving you all the right blocks that you compose together. Like headless docs to build exactly what you need.
shadcn
Creator of Shadcn UI
Major shoutout to @hanzoai for making hanzo-docs, a gorgeous documentation framework that composes beautifully into the App Router.
Anthony Shew
Turbo DX at Vercel
hanzo-docs is the best Next.js docs framework
Aiden Bai
Creator of Million.js
I'd have no shot building @arktypeio docs that looked half this good without it 😍
David Blass
Creator of Arktype
You know how you end up rebuilding a full docs site every time you start a new project? Hanzo Docs fixes this by giving you all the right blocks that you compose together. Like headless docs to build exactly what you need.
shadcn
Creator of Shadcn UI
Major shoutout to @hanzoai for making hanzo-docs, a gorgeous documentation framework that composes beautifully into the App Router.
Anthony Shew
Turbo DX at Vercel
hanzo-docs is the best Next.js docs framework
Aiden Bai
Creator of Million.js
I'd have no shot building @arktypeio docs that looked half this good without it 😍
David Blass
Creator of Arktype
Minimal aesthetics, Maximum customizability.
Hanzo Docs offer well-designed themes, with a headless mode to plug your own UI.
Pro designer? Customise the theme using Hanzo Docs CLI.
pnpm dlx @hanzo-docs/cli customise
> Choose a layout to customise...Anybody can write.
Native support for Markdown & MDX, offering intuitive, convenient and extensive syntax for non-dev writers, developers, and AI agents.
---
title: Hello World
---
## Overview
I love **Hanzo Docs**!
```ts tab="Tab 1"
console.log("Hello World")
```
```ts tab="Tab 2"
return 0;
```The familiar syntax.
It is just Markdown, with additional features seamlessly composing into the syntax.
- Markdown features, including images
- Syntax highlighting (Powered by Shiki)
- Codeblock Groups
- Callouts
- Cards
- Custom Heading Anchors
- Auto Table of Contents
Docs For Engineers.
Framework Agnostic
Official support for Next.js, Tanstack Start, React Router, Waku — portable to any React.js framework.
A truly composable framework.
Separated as Content → Core → UI, offering the high composability that engineers love — you can use Hanzo Docs as a library, without adapting the entire framework.
hanzo-docs-mdx
Use MDX in your React framework elegantly.
hanzo-docs-core
Headless library for building docs + handling content.
hanzo-docs-ui
UI library for building docs.
hanzo-docs-openapi
Extend Hanzo Docs to render OpenAPI docs.
hanzo-docs-obsidian
Extend Hanzo Docs to handle Obsidian-style Markdown.
Adopts your content.
Designed to integrate with any content source, Hanzo Docs works on MDX, Content Collections, and even your own CMS.
import { loader } from '@hanzo/docs/core/source';
import { docs } from '@hanzo/mdx:collections/server';
export const source = loader({
source: docs.toHanzo DocsSource(),
baseUrl: '/docs',
});My CMS
--- title: Hello World --- # Hello World! This is my first document.
Enhance your search experience.
Integrate with Orama Search and Algolia Search in your docs easily.
Learn MoreGetting Started
Use Hanzo Docs in your project.
Components
The UI Components for your docs.
MDX Content
Using MDX for content.
User Guide
How to use Hanzo Docs.
The shadcn/ui for docs
Hanzo Docs CLI creates interactive components for your docs, offering a rich experience to your users.
Commands
A Framework of Dream.
Made Possible by You.
Hanzo Docs is 100% powered by passion and open source community.
Build Your Docs
light and gorgeous, just like the moon.
- Battery guaranteed.Actively maintained, open for contributions.
- Fully open-source.Open source, available on Github.
- Within seconds.Initialize a new project instantly with CLI.
- Read docsOpen GitHub