使用品牌颜色.
将品牌颜色用于版块、文本和按钮，让每个页面看起来属于同一个网站。DXPR Builder 的每个颜色字段都将主题调色板显示为色板，因此您选用品牌颜色，不用猜代码。示例给版块刷上品牌主色并配白色文字。
该视频跟随下文步骤：用品牌色板给版块上色，并将其文本设为白色。
开始之前
- 品牌颜色存放在主题中。用 DXPR Theme 时，请在 Appearance > Settings > DXPR Theme (
/admin/appearance/settings/dxpr_theme) 的 Colors 面板中设置。 - DXPR Builder 将该调色板前十种不同的颜色显示为色板。
给版块上色
- 悬停版块，打开 More 并选择 Settings。
- 打开 Style 面板。
- 点击 Background 的颜色按钮。颜色选择器带着您的色板打开。
- 点击品牌主色色板。
- 点击 Font color 的颜色按钮并选择白色。
- 点击 Save。段落文本变白；标题保持主题的标题颜色。
- 要让标题也变白，请打开 Settings（其 Text 元素的），将其 Font color 设为白色（其 Style 面板中），并点击 Save。
您会看到的内容
版块填上品牌颜色，段落文本和标题变白。同样的色板出现在每个颜色字段中，包括 Style 和 Hover style 面板，以及 Start color 和 End color（版块 Gradient 背景的）。
要用调色板外的颜色，请在选择器的文本框中输入其代码，例如 #2196F3。拖动不透明度滑块得到半透明颜色。Clear 清除颜色。
让颜色跟随主题
色板将颜色代码复制到元素中。以后更改主题调色板，该元素保留旧颜色。
要让元素跟随调色板，请改用颜色类。打开元素的 Settings，在 HTML classes 下选一个色块：
| 色块 | 作用 |
|---|---|
| Primary background、Secondary background 等 | 主题的 Bootstrap 颜色 |
| Primary text color、Secondary text color 等 | 主题的 Bootstrap 文本颜色 |
| Background color: DXPR Theme primary | DXPR Theme 的 Primary 颜色，附带匹配的文本颜色 |
| Text color: DXPR Theme accent1 | DXPR Theme 的 Secondary 颜色，用于文本 |
该 DXPR Theme 色块只在启用 DXPR Theme 时出现。
各元素的颜色字段
| 位置 | 装饰对象 |
|---|---|
| Style 面板：Font color、Border color、Background | 元素自己 |
| Hover style 面板：同样的字段 | 指针停在上面时的元素 |
| Button：Type | 现成的按钮配色方案 |
| Card：Type | 整张卡片的背景和文本 |
| Alert：Type | Success、Info、Warning 或 Danger |
| Section：Background effects > Gradient | 两种颜色的混合 |
可读的颜色
- 文本与背景保持足够对比度。WCAG 2.1 AA 级要求普通文本至少 4.5 比 1。
- 不要只用颜色传递含义；请配上标签或图标。
- 交替使用版块背景（如白色、浅灰和品牌色），让长页面有节奏。
如果您看不到自己的颜色
- 颜色选择器中没有色板。 您网站的默认主题没有提供调色板。请直接输入颜色代码，或换用带调色板的主题，如 DXPR Theme。
- 更改主题调色板后，元素还是旧颜色。 色板存放固定的颜色代码。请选用新色板，或换用 HTML classes 下跟随调色板的颜色色块。
- Background 或 Font color 对卡片无效。 Type 非 Default 的卡片用胜出的主题类定颜色。请先将 Type 设为 Default。