外观与品牌
在 docs.json 中配置主题、颜色、logo、favicon、字体和背景。
使用这些 docs.json 设置来控制文档站点的视觉标识——布局主题、品牌颜色、logo、字体和背景。
设置
theme - 必需
站点的布局主题。
可选值:mint、maple、palm、willow、linden、almond、aspen、sequoia、luma。
详情请参阅主题的预览和说明。
name - 必需
类型: string
你的项目、组织或产品的名称。显示在浏览器标签标题和站点的其他位置。
colors - 必需
类型: object
文档中使用的颜色。不同主题对颜色的显示方式不同。如果你只提供主色,它将应用于所有颜色元素。
colors.primarystringrequired文档的主色。通常在浅色模式下用于强调,具体因主题而异。
必须是以 # 开头的十六进制代码。示例:"#0D9373"。
colors.lightstring在深色模式下用于强调的颜色。
必须是以 # 开头的十六进制代码。
colors.darkstring在浅色和深色模式下用于按钮和悬停状态的颜色,具体因主题而异。
必须是以 # 开头的十六进制代码。
"colors": {
"primary": "#0D9373",
"light": "#55D799",
"dark": "#0D9373"
}logo
类型: string 或 object
站点的 logo。提供单个图片路径或为浅色和深色模式提供单独的图片。
logo.lightstringrequired浅色模式下 logo 文件的路径。包含文件扩展名。示例:/logo/light.svg。
logo.darkstringrequired深色模式下 logo 文件的路径。包含文件扩展名。示例:/logo/dark.svg。
logo.hrefstring (uri)点击 logo 时重定向到的 URL。如果未提供,对于国际化文档,logo 链接到当前所选区域设置的第一页,对于单语言站点则链接到首页。示例:https://yoursite.com。
"logo": {
"light": "/logo/light.svg",
"dark": "/logo/dark.svg",
"href": "https://yoursite.com"
}favicon
类型: string 或 object
favicon 文件的路径,包含文件扩展名。会自动调整为适当的 favicon 尺寸。提供单个文件或为浅色和深色模式提供单独的文件。
favicon.lightstringrequired浅色模式下 favicon 的路径。包含文件扩展名。示例:/favicon.png。
favicon.darkstringrequired深色模式下 favicon 的路径。包含文件扩展名。示例:/favicon-dark.png。
"favicon": "/favicon.svg"appearance
类型: object
浅色/深色模式设置。
appearance.default"system" | "light" | "dark"默认颜色模式。选择 system 以匹配用户操作系统设置,或选择 light 或 dark 强制使用特定模式。默认为 system。
appearance.strictboolean当为 true 时,隐藏浅色/深色模式切换,使用户无法切换模式。默认为 false。
"appearance": {
"default": "dark",
"strict": true
}fonts
类型: object
文档的自定义字体。默认字体因主题而异。支持 Google Fonts 和自托管字体。
fonts.familystringrequired字体系列名称,如 "Inter" 或 "Open Sans"。支持 Google Fonts 系列名称——这些会自动加载,无需 source。
fonts.weightnumber字体粗细,如 400 或 700。可变字体支持小数粗细,如 550。
fonts.sourcestring (uri)托管字体的 URL 或本地字体文件的路径。Google Fonts 不需要此项。
- 托管:
https://example.com/fonts/MyFont.woff2 - 本地:
/fonts/MyFont.woff2
fonts.format"woff" | "woff2"字体文件格式。使用 source 字段时必需。
fonts.headingobject仅用于标题的字体设置覆盖。
接受与顶级 fonts 对象相同的 family、weight、source 和 format 字段。
fonts.bodyobject仅用于正文的字体设置覆盖。
接受与顶级 fonts 对象相同的 family、weight、source 和 format 字段。
"fonts": {
"family": "Inter",
"heading": {
"family": "Playfair Display"
}
}icons
类型: object
图标库设置。每个项目只能使用一个图标库。文档中的所有图标名称必须来自所选的图标库。
icons.library"fontawesome" | "lucide" | "tabler"required在整个文档中使用的图标库。默认为 fontawesome。
无论库设置如何,你可以为任何单个图标指定指向外部托管图标的 URL 或项目中图标文件的路径。
"icons": {
"library": "lucide"
}background
类型: object
背景图片、装饰和颜色设置。
background.decoration"gradient" | "grid" | "windows"主题的装饰背景图案。
background.colorobject浅色和深色模式的自定义背景颜色。
Show Hide background.color
lightstring浅色模式的背景颜色。必须是以 # 开头的十六进制代码。
darkstring深色模式的背景颜色。必须是以 # 开头的十六进制代码。
background.imagestring 或 object站点的背景图片。提供单个路径或为浅色和深色模式提供单独的路径。
Show Hide background.image
lightstringrequired浅色模式背景图片的路径。示例:/background.png。
darkstringrequired深色模式背景图片的路径。示例:/background-dark.png。
"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 主题名称字符串:将该主题应用于所有代码块
- 带有
light和dark键的对象:为每种模式应用单独的 Shiki 主题
Show Hide styling.codeblocks object
themestring用于两种模式的单个 Shiki 主题。
"styling": {
"codeblocks": {
"theme": "dracula"
}
}themeobject为浅色和深色模式分别设置 Shiki 主题。
Show Hide theme
lightstringrequired浅色模式的 Shiki 主题名称。
darkstringrequired深色模式的 Shiki 主题名称。
"styling": {
"codeblocks": {
"theme": {
"light": "github-light",
"dark": "github-dark"
}
}
}languagesobject代码块的自定义语言配置。
Show Hide 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 Hide thumbnails.fonts
familystringrequired字体系列名称,如 "Open Sans" 或 "Playfair Display"。支持 Google Fonts 系列名称。
示例
{
"$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"
}
}