跳转到主要内容
使用这些 docs.json 设置来控制文档站点的视觉标识——布局主题、品牌颜色、logo、字体和背景。

​
设置

​
theme - 必需

站点的布局主题。 可选值：mint、maple、palm、willow、linden、almond、aspen、sequoia、luma。 详情请参阅主题的预览和说明。

​
name - 必需

类型： string 你的项目、组织或产品的名称。显示在浏览器标签标题和站点的其他位置。

​
colors - 必需

类型： object 文档中使用的颜色。不同主题对颜色的显示方式不同。如果你只提供主色，它将应用于所有颜色元素。
​
colors.primary
string
必填
文档的主色。通常在浅色模式下用于强调，具体因主题而异。必须是以 # 开头的十六进制代码。示例："#0D9373"。
​
colors.light
string
在深色模式下用于强调的颜色。必须是以 # 开头的十六进制代码。
​
colors.dark
string
在浅色和深色模式下用于按钮和悬停状态的颜色，具体因主题而异。必须是以 # 开头的十六进制代码。
docs.json
"colors": {
  "primary": "#0D9373",
  "light": "#55D799",
  "dark": "#0D9373"
}
类型： string 或 object 站点的 logo。提供单个图片路径或为浅色和深色模式提供单独的图片。
​
logo.light
string
必填
浅色模式下 logo 文件的路径。包含文件扩展名。示例：/logo/light.svg。
​
logo.dark
string
必填
深色模式下 logo 文件的路径。包含文件扩展名。示例：/logo/dark.svg。
​
logo.href
string (uri)
点击 logo 时重定向到的 URL。如果未提供，对于国际化文档，logo 链接到当前所选区域设置的第一页，对于单语言站点则链接到首页。示例：https://yoursite.com。
docs.json
"logo": {
  "light": "/logo/light.svg",
  "dark": "/logo/dark.svg",
  "href": "https://yoursite.com"
}

​
favicon

类型： string 或 object favicon 文件的路径，包含文件扩展名。会自动调整为适当的 favicon 尺寸。提供单个文件或为浅色和深色模式提供单独的文件。
​
favicon.light
string
必填
浅色模式下 favicon 的路径。包含文件扩展名。示例：/favicon.png。
​
favicon.dark
string
必填
深色模式下 favicon 的路径。包含文件扩展名。示例：/favicon-dark.png。
docs.json
"favicon": "/favicon.svg"

​
appearance

类型： object 浅色/深色模式设置。
​
appearance.default
"system" | "light" | "dark"
默认颜色模式。选择 system 以匹配用户操作系统设置，或选择 light 或 dark 强制使用特定模式。默认为 system。
​
appearance.strict
boolean
当为 true 时，隐藏浅色/深色模式切换，使用户无法切换模式。默认为 false。
docs.json
"appearance": {
  "default": "dark",
  "strict": true
}

​
fonts

类型： object 文档的自定义字体。默认字体因主题而异。支持 Google Fonts 和自托管字体。
​
fonts.family
string
必填
字体系列名称，如 "Inter" 或 "Open Sans"。支持 Google Fonts 系列名称——这些会自动加载，无需 source。
​
fonts.weight
number
字体粗细，如 400 或 700。可变字体支持小数粗细，如 550。
​
fonts.source
string (uri)
托管字体的 URL 或本地字体文件的路径。Google Fonts 不需要此项。
  • 托管：https://example.com/fonts/MyFont.woff2
  • 本地：/fonts/MyFont.woff2
​
fonts.format
"woff" | "woff2"
字体文件格式。使用 source 字段时必需。
​
fonts.heading
object
仅用于标题的字体设置覆盖。接受与顶级 fonts 对象相同的 family、weight、source 和 format 字段。
​
fonts.body
object
仅用于正文的字体设置覆盖。接受与顶级 fonts 对象相同的 family、weight、source 和 format 字段。
docs.json
"fonts": {
  "family": "Inter",
  "heading": {
    "family": "Playfair Display"
  }
}

​
icons

类型： object 图标库设置。每个项目只能使用一个图标库。文档中的所有图标名称必须来自所选的图标库。
​
icons.library
"fontawesome" | "lucide" | "tabler"
必填
在整个文档中使用的图标库。默认为 fontawesome。
无论库设置如何，你可以为任何单个图标指定指向外部托管图标的 URL 或项目中图标文件的路径。
docs.json
"icons": {
  "library": "lucide"
}

​
background

类型： object 背景图片、装饰和颜色设置。
​
background.decoration
"gradient" | "grid" | "windows"
主题的装饰背景图案。
​
background.color
object
浅色和深色模式的自定义背景颜色。
​
background.image
string 或 object
站点的背景图片。提供单个路径或为浅色和深色模式提供单独的路径。
docs.json
"background": {
  "decoration": "gradient",
  "color": {
    "light": "#F8FAFC",
    "dark": "#0F172A"
  }
}

​
styling

类型： object 精细的视觉样式控制。
​
styling.eyebrows
"section" | "breadcrumbs"
页面 eyebrow 的样式（页面顶部显示的标签）。选择 section 显示章节名称，或选择 breadcrumbs 显示完整导航路径。默认为 section。
​
styling.latex
boolean
控制是否加载 LaTeX 样式表。默认情况下，Mintlify 会自动检测内容中的 LaTeX 使用并加载必要的样式表。
  • 设置为 true 可在自动检测失败时强制加载 LaTeX 样式表。
  • 如果你不使用数学表达式，设置为 false 可阻止加载 LaTeX 样式表以提高性能。
​
styling.codeblocks
"system" | "dark" | string | object
代码块主题。默认为 "system"。
  • "system"：匹配当前站点模式（浅色或深色）
  • "dark"：始终使用深色模式
  • Shiki 主题名称字符串：将该主题应用于所有代码块
  • 带有 light 和 dark 键的对象：为每种模式应用单独的 Shiki 主题

​
thumbnails

类型： object 社交媒体和页面预览的缩略图自定义。
​
thumbnails.appearance
"light" | "dark"
缩略图的视觉主题。如果未设置，缩略图使用 colors 定义的站点配色方案。
​
thumbnails.background
string
缩略图的背景图片。可以是相对路径或绝对 URL。
​
thumbnails.fonts
object
缩略图的字体配置。仅支持 Google Fonts 系列名称。

​
示例

docs.json
{
  "$schema": "https://mintlify.com/docs.json",
  "theme": "maple",
  "name": "Example Co.",
  "colors": {
    "primary": "#3B82F6",
    "light": "#93C5FD",
    "dark": "#1D4ED8"
  },
  "logo": {
    "light": "/logo/light.svg",
    "dark": "/logo/dark.svg",
    "href": "https://example.com"
  },
  "favicon": "/favicon.svg",
  "appearance": {
    "default": "system"
  },
  "fonts": {
    "family": "Inter"
  },
  "icons": {
    "library": "lucide"
  },
  "background": {
    "decoration": "gradient"
  }
}