# 图标、颜色和主题

## 标题、图标和徽标

<figure><img src="/files/1f499233ca4b0ec9eb2ed0f0053c288edc0a77ac" alt="A GitBook screenshot showing title, icon and logo customization"><figcaption></figcaption></figure>

### 标题

你可以为你的空间设置任何你想要的标题。注意：此设置只会影响显示的标题 *在已发布的文档中*。如果你想在 GitBook 应用中编辑标题，请关闭自定义菜单，并在空间顶部进行编辑。

### 图标

你可以设置一个表情符号，或上传自己的图标。你在 **自定义** 菜单中设置的图标将作为你文档站点的 favicon。

{% hint style="info" %}
此设置只会影响显示的图标 *在已发布的文档中*。如果你想编辑 GitBook 应用中使用的图标，可以在空间内编辑内容时进行。
{% endhint %}

### 自定义徽标 <mark style="background-color:purple;">（Premium 和 Ultimate）</mark>

你可以将 *两者* 已发布空间的标题和图标替换为自定义徽标，这样你的文档就能更好地体现你的品牌形象——而且你可以上传两个版本：一个用于浅色模式，一个用于深色模式。

{% hint style="info" %}
**图标和徽标选项有什么区别？**

图标设置允许你上传一张较小的 132×132 像素图片，它将显示 *在你的空间标题旁边* 并作为你站点的 favicon。自定义徽标选项允许你上传更大的图片（我们建议至少 600 像素宽），它会完全替换你设置的任何图标和标题。
{% endhint %}

## 主题

主题让你可以自定义已发布内容在浅色和深色模式下的配色方案。共有四种主题可供选择。你站点的颜色将直接受到你选择的 **主色** 并 **色调** 的影响。这两个选项会影响界面的各个部分，并能完全改变你站点的外观和感觉。

<figure><img src="/files/885a317c94bf0c758ec523669331d6738b91202e" alt="A GitBook screenshot showing theme options"><figcaption></figcaption></figure>

### 简洁

一种现代主题，具有半透明效果和极简风格元素。你的主色（或色调）会影响链接和其他高亮界面元素。

*简洁主题适用于所有站点，并且是默认主题。*

### 柔和

一种精致主题，元素之间的对比度更低。站点背景更加突出，并与前景融为一体，而且某些元素呈现反色外观——这一切都基于你的主色（或色调）。

*柔和主题适用于所有站点。*

### 加粗 <mark style="background-color:purple;">（Premium 和 Ultimate）</mark>

一种高冲击力主题，具有鲜明的颜色和强烈的对比。你的主色（或色调）将用于站点页眉，其他高亮元素如图标也会随之着色。

*鲜明主题仅适用于 Premium 或 Ultimate 站点。*

### 渐变 <mark style="background-color:purple;">（Premium 和 Ultimate）</mark>

一种引领潮流的主题，具有渐变背景和色彩点缀。渐变和高亮元素将由你的主色（或色调）着色。

*渐变主题仅适用于 Premium 或 Ultimate 站点。*

## 颜色

<figure><img src="/files/d0257001df6d9011aa266d9d87a35d863f009f5a" alt="A GitBook screenshot showing color customization"><figcaption></figcaption></figure>

### 主色

你站点的主色会影响高亮界面项目以及导航元素的样式，例如链接、当前页面和部分、面包屑，以及页眉主按钮。

如果与背景的对比度过低，或者访客的系统要求更高对比度，GitBook 会自动调整单个元素的颜色以确保可读性。

### 色调颜色

你站点的色调颜色会轻微改变整个站点中所有文字和图标的颜色——包括页眉链接、图标颜色，以及像 **提问或搜索** 栏这样的 UI 元素。

色调颜色会 *不* 影响链接和按钮等导航元素，这些元素始终使用主色。

在 **色调颜色** 部分中，你会看到基于你所选主色的建议颜色。你可以选择其中一个进行预览，将你的主色作为色调，或使用取色器选择一个完全自定义的颜色。

### 语义颜色 <mark style="background-color:purple;">（Premium 和 Ultimate）</mark>

语义颜色会应用于你已发布内容中的提示块，也可以应用于代码块。

你可以更改每种提示样式的背景颜色；这些更改将反映在你正在自定义的已发布站点上。

{% hint style="info" %}
**注意：** GitBook 编辑器中的提示块将始终保持其标准颜色，不会与你站点的语义颜色一致。
{% endhint %}

### 代码主题 <mark style="background-color:purple;">（Premium 和 Ultimate）</mark>

代码主题会改变你已发布文档中代码和 API 块的外观。

主题列表包括：

* **自适应主题** – 这些标准的浅色和深色模式主题会使用你站点的配色方案来匹配你的品牌。
* [**Shiki**](https://shiki.style/themes) **主题** – 在浅色和深色模式下可从 60 多种主题预设中进行选择。

你可以为文档的浅色和深色模式分别选择不同的代码主题。而且你可以在任意模式下使用任意浅色或深色配色方案——例如，在文档为浅色模式时使用深色代码主题。

默认情况下，你选择的主题将同时应用于代码块和 OpenAPI 块。如果你想为 OpenAPI 块设置不同的主题，请点击 **按块类型自定义** <picture><source srcset="/files/CG9bVSmdbJnQxrYiNbRI" media="(prefers-color-scheme: dark)"><img src="/files/9bcd313f64920f73d3606c61b9fbde5ddf8e3f6b" alt=""></picture> 按钮。

## 模式

### 显示模式切换

如果你希望访客手动切换浅色和深色模式，请启用此项。读者可以在任何已发布页面的底部、桌面端和移动端都找到切换开关。

### 默认模式

选择访客默认以浅色还是深色模式查看你的内容。如果 **显示模式切换** 已启用，他们可以切换模式；如果已禁用，他们将只能看到你在此处选择的模式。

*注意：要在 GitBook 应用中更改主题，请前往侧边栏底部的“设置”菜单。*

## 站点样式

<figure><img src="/files/7141b3caaedef5eee0940504179e67907172adff" alt="A GitBook screenshot showing site style settings"><figcaption></figcaption></figure>

### 字体家族 <mark style="background-color:purple;">（Premium 和 Ultimate）</mark>

从精选的热门选项列表中，为你已发布的内容选择一种标准字体家族和一种等宽字体家族。

{% hint style="info" %}
等宽字体用于你文档站点中的代码块和 OpenAPI 块。
{% endhint %}

### 自定义字体 <mark style="background-color:purple;">（仅 Ultimate）</mark>

上传你自己的标准字体和等宽字体，使你已发布的内容与品牌风格指南保持一致。要上传字体，请点击 **添加自定义字体** 并按照说明操作。你必须上传常规字重和粗体字重的字体文件。

GitBook 目前支持 `.woff` 并 `.woff2`。对于其他格式，请联系 <support@gitbook.com>.

### 图标 <mark style="background-color:purple;">（Premium 和 Ultimate）</mark>

使用页面图标时，请在此处设置所显示图标的字重和样式。

### 圆角样式

可选择圆角或直角，以符合你的品牌风格偏好。

### 深度样式

在两种深度样式之间进行选择，它们适用于卡片、按钮以及任何带阴影的其他元素：

* **细微：** 一些阴影和层次感。
* **扁平：** 没有阴影或层次感。

### 链接样式

在两种链接设计之间进行选择：

* **默认：** 用你的主色或色调颜色高亮整个链接。
* **强调：** 为链接添加彩色下划线，同时保持文本颜色不变。

## 侧边栏样式

<figure><img src="/files/1fc3dfa7561dd30f42a08bfd0608f7a183c0cddd" alt="A GitBook screenshot showing sidebar style options"><figcaption><p>此菜单可让你直观了解不同样式将如何改变侧边栏的外观。</p></figcaption></figure>

### 背景样式

为侧边栏容器选择背景样式。颜色源自你所选的主题。

有两个选项—— **默认** 并 **填充** ——每个选项都提供其如何改变目录的视觉示意。

### 列表样式

为侧边栏列表及其选中项选择样式。有三个选项—— **默认**, **胶囊** 并 **线条** ——每个选项都提供其如何改变目录的视觉示意。


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://gitbook.com/docs/documentation/zh/docs-site/customization/icons-colors-and-themes.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
