Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/shuding/nextra/llms.txt

Use this file to discover all available pages before exploring further.

Nextra is a framework built on top of Next.js that turns your MDX files into a fast, polished website. Whether you’re building documentation, a blog, or a fully custom content site, Nextra gives you file-system routing, a powerful theme system, and built-in components — all without leaving the Next.js ecosystem.

Docs Theme

Build a full documentation site with sidebar, TOC, and search in minutes.

Blog Theme

Launch a blog with tags, RSS feed, and post navigation out of the box.

Custom Theme

Build a completely bespoke layout using Nextra’s low-level primitives.

API Reference

Explore the full configuration API and all exported utilities.

​
What is Nextra?

Nextra wraps Next.js as a webpack/Turbopack plugin and adds:
  • MDX support — Every .md and .mdx file in your content/ directory or app/ router is compiled to a React component. Use React components, hooks, and imports directly inside your Markdown.
  • File-system routing — Your file structure becomes your site structure. Organize with _meta.js files to control sidebar order, titles, and visibility.
  • Themes — Ship a docs site (nextra-theme-docs) or blog (nextra-theme-blog) with a single import, or write your own theme.
  • Built-in components — <Callout>, <Cards>, <Tabs>, <Steps>, <FileTree>, <Banner>, and more — all designed to work seamlessly in MDX.
  • Syntax highlighting — Powered by Shiki at build time, with line highlighting, copy buttons, and inline code highlighting.
  • Search — Static full-text search via Pagefind — no server required.
  • i18n — First-class internationalization using Next.js’s built-in i18n routing.

​
Quick start

Choose your path based on what you’re building:
1
Install dependencies
2
Add Next.js, React, and Nextra to your project.
3
npm i next react react-dom nextra nextra-theme-docs
4
Configure Next.js
5
Wrap your Next.js config with the Nextra plugin.
6
import nextra from 'nextra'

const withNextra = nextra({
  // Nextra options
})

export default withNextra({
  // Next.js options
})
7
Create your first page
8
Add a content/index.mdx file and start writing.
9
# Hello Nextra

Welcome to my site built with Nextra!
10
Run the dev server
11
npm run dev
12
Your site is now running at http://localhost:3000.

​
Key features

File Conventions

Learn how to structure content/, _meta.js, and mdx-components files.

Writing Content

MDX, GFM, syntax highlighting, LaTeX, Mermaid diagrams, and more.

Built-In Components

Callouts, Cards, Tabs, Steps, FileTree — ready to use in any MDX file.

Advanced

Tailwind CSS, custom CSS, Turbopack, remote content, static exports.

​
Requirements

  • Node.js 18 or later
  • Next.js 14 or later (app router only in Nextra 4)
  • React 18 or later
Nextra 4 requires the Next.js app router. If you’re using the pages router, use Nextra 3.x.

Build docs developers (and LLMs) love

Get started for freeTalk to us