Inline TOC

Install to your codebase

Easier customisation & control.

Usage

You can use it in your MDX content:

content.mdx

import { InlineTOC } from 'fumadocs-ui/components/inline-toc';

<InlineTOC items={toc}>Table of Contents</InlineTOC>

Or adding it to every page.

page.tsx

import { DocsPage } from 'fumadocs-ui/page';
import { InlineTOC } from 'fumadocs-ui/components/inline-toc';

export default function Page() {
  // ...
  return (
    <DocsPage>
      <InlineTOC items={page.data.toc}>Table of Contents</InlineTOC>
    </DocsPage>
  );
}

Reference

Prop

Type

Usage

Reference

On this page