Each page is an MDX file, which combines Markdown content with React components to let you create rich, interactive documentation.

Page metadata

Every page starts with frontmatter—YAML metadata enclosed by --- at the beginning of your file. This metadata controls how your page appears and behaves.
title
string
required
The title of your page that appears in navigation and browser tabs.
description
string
A brief description of what this page covers. Appears under the title and improves SEO.
sidebarTitle
string
A short title that displays in the sidebar navigation.
icon
string
An icon next to your page title in the sidebar. Choose an icon from Font Awesome, Lucide, or use a custom URL. Configure your preferred icon library with the icons library setting.
tag
string
A tag that appears next to your page title in the sidebar.
Example YAML frontmatter
---
title: "About frontmatter"
description: "Frontmatter is the metadata that controls how your page appears and behaves"
sidebarTitle: "Frontmatter"
icon: "book"
tag: "NEW"
---

Page mode

Control how your page displays with the mode setting.

Default

If no mode is defined, defaults to a standard layout with a sidebar navigation and table of contents.
---
title: "Default page title"
---

Wide

Wide mode hides the table of contents. This is useful for pages that do not have any headings or if you prefer to use the extra horizontal space.
---
title: "Wide page title"
mode: "wide"
---

Custom

Custom mode provides a minimalist layout that removes all elements except for the top navbar. Custom mode is a blank canvas to create landing pages or any other unique layouts that you want to have minimal navigation elements for.
---
title: "Custom page title"
mode: "custom"
---

Center

Center mode removes the sidebar and table of contents, centering the content. This is useful for changelogs or other pages where you want to emphasize the content.
---
title: "Center page title"
mode: "center"
---

API pages

Create interactive API playgrounds by adding an API specification to your frontmatter, api or openapi.
---
openapi: "GET /endpoint"
---
Learn more about building API documentation. Link to external sites directly from your navigation with the url metadata.
---
title: "npm Package"
url: "https://www.npmjs.com/package/mint"
---

Search engine optimization

Most SEO meta tags are automatically generated. You can set SEO meta tags manually to improve your site’s SEO, social sharing, and browser compatibility.
Meta tags with colons must be wrapped in quotes.
---
"twitter:image": "/images/social-preview.jpg"
---
See SEO for complete SEO metadata options.

Internal search keywords

Enhance a specific page’s discoverability in the built-in search by providing keywords in your metadata. These keywords won’t appear as part of the page content or in search results, but users that search for them will be shown the page as a result.
---
keywords: ['configuration', 'setup', 'getting started']
---