A VitePress-compatible documentation generator, powered by coss ui.
React 19 · Vite · Tailwind CSS v4 · Static-site generation · Beautiful by default.
cosspress does the same job as VitePress — turn a
folder of Markdown into a fast, beautiful documentation site — but it is built
entirely on the coss ui design system (the open-source UI behind Cal.com)
instead of Vue. The Markdown syntax, frontmatter and themeConfig are
intentionally VitePress-compatible, so migrating is painless.
- 📝 Markdown-centered — parsed with
markdown-it(same as VitePress): frontmatter, header anchors, custom containers and more. - 🎨 Unified coss ui design — navbar, sidebar, search, cards and buttons all come from one cohesive design system.
- 🌗 Light / dark / system theming with no flash of the wrong theme.
- 📱 Fully responsive — sticky sidebar, right-hand outline, and a mobile drawer.
- 🔍 Built-in local search — press ⌘K, no external service required.
- ⚡ Static-site generation via
vite-react-ssg— every page is pre-rendered to static HTML. - 🌈 Shiki syntax highlighting with dual light/dark themes and line highlighting.
npm install
npm run dev # http://localhost:5173
npm run build # pre-render to dist/
npm run preview # preview the production buildRequires Node.js ≥ 18.18.
.
├─ .cosspress/config.ts # site + theme configuration (VitePress-style)
├─ docs/ # your Markdown content (file-based routing)
├─ src/
│ ├─ components/ui/ # coss ui components (copy-paste, yours to edit)
│ ├─ theme/ # the default documentation theme
│ └─ lib/ # config + content loading
└─ plugins/markdown.ts # Markdown → HTML pipeline (markdown-it + Shiki)
Add a file under docs/ and it becomes a route automatically:
| File | Route |
|---|---|
docs/index.md |
/ |
docs/guide/getting-started.md |
/guide/getting-started |
docs/guide/index.md |
/guide/ |
React 19 · TypeScript · Vite 7 · Tailwind CSS v4 · coss ui · Base UI · markdown-it · Shiki · vite-react-ssg.
cosspress 是一个 VitePress 替代品：把一个装满 Markdown 的目录变成漂亮、快速、 全静态的文档站。它完全采用 coss ui 设计系统（Cal.com 背后的开源 UI），技术栈与 Cloud-PE 官网一致——React + Vite + Tailwind CSS v4。语法兼容 VitePress，拥有响应式设计、深浅色切换、本地搜索、静态生成 等 VitePress 的核心能力，且 UI 全面统一。