Documentation
Build beautiful, searchable documentation with Nuxt Content. Includes built-in components, and responsive design.
The boilerplate comes with a complete documentation system built on Nuxt Content, the same system powering the docs you're reading right now.
The documentation system is built to grow with your project. As you add features, simply add new markdown files and they'll automatically be included in navigation and search.
What's Included
- Pre-configured Nuxt Content setup
- Beautiful, responsive documentation theme
- Built-in components for common documentation needs
- Full-text search capability
- Mobile-optimized navigation
- Dark mode support
File Structure
Documentation lives in your content/docs
directory with a simple, intuitive structure:
Custom Components
Create reusable documentation components in ~/app/components/content
:
<template>
<div class="my-4 p-4 border rounded-lg">
<div class="font-mono">{{ method }} {{ endpoint }}</div>
<p class="mt-2 text-gray-600">{{ description }}</p>
</div>
</template>
<script setup>
defineProps(['method', 'endpoint', 'description'])
</script>
Use them in your markdown:
::api-endpoint{method="GET" endpoint="/api/v1/users" description="List all users"}
::
Search
Full-text search is included out of the box. Powered by Nuxt Content.
Customization
export default defineNuxtConfig({
content: {
highlight: {
langs: ["ts", "vue", "prisma", "bash"],
theme: {
default: "github-light",
dark: "github-dark",
sepia: "monokai",
},
},
experimental: {
search: {
indexed: true,
},
},
},
})
Need Help?
- Browse the Nuxt Content documentation
- Join our Discord community for support
- Check out shadcn-docs-nuxt for theme examples
See It in Action
You are seeing it action right now! When you purchase, you'll get its complete source code.