主题配色

1. 概述

在优化仪表板组件样式时,用户常常需要配置颜色属性,比如设置组件背景色、调整字体颜色等等。然而,如何巧妙搭配各种颜色,使看板呈现出和谐美观的视觉效果,往往让用户感到困扰。

本文将详细地介绍「主题配色」功能,助力用户轻松优化看板整体色彩,同时大幅降低操作成本,让看板设计变得更加简单高效。

2. 什么是主题配色

产品中内置多套主题样式,每套主题样式拥有一套与之相匹配且和谐的颜色方案,即「主题配色」。

以「冷静蓝灰」主题为例,其主题配色应用于整个看板,使看板在视觉上保持一致的风格。

3. 切换「主题样式」

1)图表、「其他」组件的样式设置中使用了主题配色,切换主题样式后,主题配色会相应变化,快速适配看板的整体风格。

例如,将某一主题配色中的颜色设为标题控件的背景色,切换主题样式后,该背景颜色会自动变为新主题对应位置的颜色,确保看板风格的连贯性。

2)若使用标准色作为背景颜色,在切换主题样式后,颜色不会动态改变。

因此,为保证看板整体色彩风格的一致性,建议在修改「其他」组件配色时,优先从主题配色中选取颜色。

3)特别说明:若对画布页面背景、「控件」组件样式设置了主题配色,不支持 1)中的规则,切换主题样式后,将变为主题样式中设置的默认色。

4. 主题配色使用建议

1)主题配色的第一列通常为「背景颜色」,适合用于看板整体背景、图片组件背景等。

2)主题配色的第二列一般作为「文字颜色」,常用于标题、时间控件等。比如,第一行可设为一级标题颜色,第二行设为二级标题颜色,以区分不同层级的文字信息,增强信息的可读性。

3)主题配色中其余列的组合色,用户可根据实际需求灵活设置。这些组合色可用于按钮边框等等,为看板增添丰富的视觉层次。

5. 模板示例

下面将以一个模板演示主题配色的使用:

1)第一列作为背景色使用:

  • 第一列第一个为仪表板整体背景颜色;
  • 第一列第二个为各区域的图片背景颜色;

这两个背景色搭配起来较为和谐,若有第三层分区,同样可从第一列选取其他颜色,确保背景颜色的协调性。

2)第二列作为文字颜色使用:

  • 第二列第一个为一级标题颜色,突出区域主题;
  • 第二列第二个为二级标题颜色,辅助区分内容层级;

若存在三级标题,可从该列其他颜色中选择合适的颜色,使各级标题在视觉上层次分明。

3)当模板使用主题配色进行样式设置后,切换主题样式时,看板的颜色会随之改变,且整体依然保持和谐美观。用户无需重新调整颜色搭配,就能轻松切换看板风格。

文档内容是否对您有帮助?
有帮助
没帮助没帮助
如需获取即时帮助,请联系技术支持
咨询
扫码领取100+零代码资料简道云官方微信号400-111-0890
图标在线咨询
立即体验