Customize your site

This starter uses a custom Astro frontend with Mintlify’s content tools and components. Because the frontend is yours, not every docs.json configuration option from the full Mintlify reference applies.

What docs.json controls: Navigation structure, page metadata, and content configuration.

What you control: Styling, layouts, and how your site renders. These live in your Astro project under src/.

If a docs.json option doesn’t seem to have any effect, it likely isn’t wired up in the Astro frontend. Check the templates in src/ to see how configuration values are consumed, and adjust there.

Construct the navigation for your documentation in docs.json.

{
  "navigation": {
    "tabs": [
      {
        "tab": "Docs",
        "groups": [
          {
            "group": "Getting started",
            "pages": [
              "index",
              "quickstart"
            ]
          }
        ]
      }
    ]
  }
}

Page paths are relative to the docs/ directory without the .mdx extension. Use forward slashes for nested pages. For example, guides/example.

Site metadata

Set a site name and other metadata in docs.json.

{
  "name": "My Docs",
  "favicon": "/favicon.svg",
  "logo": {
    "light": "/logo/light.svg",
    "dark": "/logo/dark.svg"
  }
}

Whether these values take effect depends on how the Astro templates in src/ reference them.

Styling and layouts

Since this is a custom Astro project, you have direct control over how your site looks:

Path	What it controls
`src/layouts/`	Page layout templates.
`src/styles/`	Global CSS and Tailwind configuration.
`src/components/`	Custom Astro and React components.

To change colors, fonts, spacing, or other visual properties, edit the files in src/ directly rather than relying on docs.json values like colors or navbar.

Changes to files in src/ take effect immediately when the dev server is running.