项目色彩规范

Youth Design 的项目色彩规范规定了项目中的配色与使用注意事项

各项目在 UI 设计阶段确定各自的色彩规范,项目色彩规范继承自 Youth Design 的色彩规范,主要包含以下内容:

  1. 主色:应用于绝大部分元素,例如header、icon、边框、按钮、背景等,确定主色之后尽可能多的元素使用这个颜色值,体现设计的外观一致性。

  2. 强调色:应用于需要和主色产生一定对比的元素,以便让用户明显感觉到元素的存在,例如悬浮按钮、文字按钮、选中文本、进度条、开个、滑块、链接、标题等。

  3. 功能色:有些元素的颜色不适合用主色或强调色来表示,在色彩规范中也应有所规定,例如错误警告一般使用红色,通过状态一般使用绿色。

  4. 文本色:暗色背景中的主文本色、辅助文本色;亮色背景中的主文本色、辅助文本色。

示例

YIS-项目色彩规范

主色

文本使用

强调色

文本使用

背景色

文本使用

文本色 ---- 深色背景上的文本

文本使用

文本色 ---- 浅色背景上的文本

文本使用

功能色 ----- 错误/成功/链接/警告

文本使用