Skip to content
Mintlify
Mintlify
全局设置

外观与品牌

在 docs.json 中配置主题、颜色、logo、favicon、字体和背景。

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

设置

theme - 必需

站点的布局主题。

可选值:mintmaplepalmwillowlindenalmondaspensequoialuma

详情请参阅主题的预览和说明。


name - 必需

类型: string

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


colors - 必需

类型: object

文档中使用的颜色。不同主题对颜色的显示方式不同。如果你只提供主色,它将应用于所有颜色元素。

colors.primarystringrequired

文档的主色。通常在浅色模式下用于强调,具体因主题而异。

必须是以 # 开头的十六进制代码。示例:"#0D9373"

colors.lightstring

在深色模式下用于强调的颜色。

必须是以 # 开头的十六进制代码。

colors.darkstring

在浅色和深色模式下用于按钮和悬停状态的颜色,具体因主题而异。

必须是以 # 开头的十六进制代码。

docs.json
"colors": {
  "primary": "#0D9373",
  "light": "#55D799",
  "dark": "#0D9373"
}

类型: stringobject

站点的 logo。提供单个图片路径或为浅色和深色模式提供单独的图片。

logo.lightstringrequired

浅色模式下 logo 文件的路径。包含文件扩展名。示例:/logo/light.svg

logo.darkstringrequired

深色模式下 logo 文件的路径。包含文件扩展名。示例:/logo/dark.svg

logo.hrefstring (uri)

点击 logo 时重定向到的 URL。如果未提供,对于国际化文档,logo 链接到当前所选区域设置的第一页,对于单语言站点则链接到首页。示例:https://yoursite.com

docs.json
"logo": {
  "light": "/logo/light.svg",
  "dark": "/logo/dark.svg",
  "href": "https://yoursite.com"
}

favicon

类型: stringobject

favicon 文件的路径,包含文件扩展名。会自动调整为适当的 favicon 尺寸。提供单个文件或为浅色和深色模式提供单独的文件。

favicon.lightstringrequired

浅色模式下 favicon 的路径。包含文件扩展名。示例:/favicon.png

favicon.darkstringrequired

深色模式下 favicon 的路径。包含文件扩展名。示例:/favicon-dark.png

docs.json
"favicon": "/favicon.svg"

appearance

类型: object

浅色/深色模式设置。

appearance.default"system" | "light" | "dark"

默认颜色模式。选择 system 以匹配用户操作系统设置,或选择 lightdark 强制使用特定模式。默认为 system

appearance.strictboolean

当为 true 时,隐藏浅色/深色模式切换,使用户无法切换模式。默认为 false

docs.json
"appearance": {
  "default": "dark",
  "strict": true
}

fonts

类型: object

文档的自定义字体。默认字体因主题而异。支持 Google Fonts 和自托管字体。

fonts.familystringrequired

字体系列名称,如 "Inter""Open Sans"。支持 Google Fonts 系列名称——这些会自动加载,无需 source

fonts.weightnumber

字体粗细,如 400700。可变字体支持小数粗细,如 550

fonts.sourcestring (uri)

托管字体的 URL 或本地字体文件的路径。Google Fonts 不需要此项。

  • 托管:https://example.com/fonts/MyFont.woff2
  • 本地:/fonts/MyFont.woff2
fonts.format"woff" | "woff2"

字体文件格式。使用 source 字段时必需。

fonts.headingobject

仅用于标题的字体设置覆盖。

接受与顶级 fonts 对象相同的 familyweightsourceformat 字段。

fonts.bodyobject

仅用于正文的字体设置覆盖。

接受与顶级 fonts 对象相同的 familyweightsourceformat 字段。

docs.json
"fonts": {
  "family": "Inter",
  "heading": {
    "family": "Playfair Display"
  }
}

icons

类型: object

图标库设置。每个项目只能使用一个图标库。文档中的所有图标名称必须来自所选的图标库。

icons.library"fontawesome" | "lucide" | "tabler"required

在整个文档中使用的图标库。默认为 fontawesome

无论库设置如何,你可以为任何单个图标指定指向外部托管图标的 URL 或项目中图标文件的路径。

docs.json
"icons": {
  "library": "lucide"
}

background

类型: object

背景图片、装饰和颜色设置。

background.decoration"gradient" | "grid" | "windows"

主题的装饰背景图案。

background.colorobject

浅色和深色模式的自定义背景颜色。

Show background.color
lightstring

浅色模式的背景颜色。必须是以 # 开头的十六进制代码。

darkstring

深色模式的背景颜色。必须是以 # 开头的十六进制代码。

background.imagestring 或 object

站点的背景图片。提供单个路径或为浅色和深色模式提供单独的路径。

Show background.image
lightstringrequired

浅色模式背景图片的路径。示例:/background.png

darkstringrequired

深色模式背景图片的路径。示例:/background-dark.png

docs.json
"background": {
  "decoration": "gradient",
  "color": {
    "light": "#F8FAFC",
    "dark": "#0F172A"
  }
}

styling

类型: object

精细的视觉样式控制。

styling.eyebrows"section" | "breadcrumbs"

页面 eyebrow 的样式(页面顶部显示的标签)。选择 section 显示章节名称,或选择 breadcrumbs 显示完整导航路径。默认为 section

styling.latexboolean

控制是否加载 LaTeX 样式表。默认情况下,Mintlify 会自动检测内容中的 LaTeX 使用并加载必要的样式表。

  • 设置为 true 可在自动检测失败时强制加载 LaTeX 样式表。
  • 如果你不使用数学表达式,设置为 false 可阻止加载 LaTeX 样式表以提高性能。
styling.codeblocks"system" | "dark" | string | object

代码块主题。默认为 "system"

  • "system":匹配当前站点模式(浅色或深色)
  • "dark":始终使用深色模式
  • Shiki 主题名称字符串:将该主题应用于所有代码块
  • 带有 lightdark 键的对象:为每种模式应用单独的 Shiki 主题
Show styling.codeblocks object
themestring

用于两种模式的单个 Shiki 主题。

"styling": {
  "codeblocks": {
    "theme": "dracula"
  }
}
themeobject

为浅色和深色模式分别设置 Shiki 主题。

Show theme
lightstringrequired

浅色模式的 Shiki 主题名称。

darkstringrequired

深色模式的 Shiki 主题名称。

"styling": {
  "codeblocks": {
    "theme": {
      "light": "github-light",
      "dark": "github-dark"
    }
  }
}
languagesobject

代码块的自定义语言配置。

Show languages
customstring 数组

描述自定义 Shiki 语言的 JSON 文件路径。用于为 Shiki 默认集中没有的语言添加语法高亮。每个文件必须遵循 TextMate 语法格式

"styling": {
  "codeblocks": {
    "languages": {
      "custom": ["/languages/my-language.json"]
    }
  }
}

thumbnails

类型: object

社交媒体和页面预览的缩略图自定义。

thumbnails.appearance"light" | "dark"

缩略图的视觉主题。如果未设置,缩略图使用 colors 定义的站点配色方案。

thumbnails.backgroundstring

缩略图的背景图片。可以是相对路径或绝对 URL。

thumbnails.fontsobject

缩略图的字体配置。仅支持 Google Fonts 系列名称。

Show thumbnails.fonts
familystringrequired

字体系列名称,如 "Open Sans""Playfair Display"。支持 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"
  }
}
Was this page helpful?Suggest editsRaise issue