标签颜色规范

标签颜色搭配规则

一、标签按颜色区分,可分为：

1.分类型

2.顺序型

3.语义型

二、标签按不同的业务类型使用不同的颜色类型：

三、Antd的Tag组件需要传递【color】参数用来修改背景颜色,组件也内置了一些颜色可供使用（内置颜色待开发集成）,以下是各类型颜色组合:

3.1 分类型A

Magenta、red、volcano、orange、gold、lime、green、cyan、blue、geekblue、purple

3.2 分类型B

#f5222d、#fa541c、#fa8c16、#faad14、#d4b106、#a0d911、#52c41a、#13c2c2、#1677ff、#2f54eb、#722ed1、#eb2f96、

3.3 分类型C

#ff7875、#ff9c6e、#ffc069、#95de64、#5cdbd3、#69b1ff、#85a5ff、#b37feb、#ff85c0

3.4 分类型D

#ff4d4f、#ff7a45、#ffa940、#ffc53d、#bae637、#73d13d、#36cfc9、#4096ff、#597ef7、#9254de、#f759ab

3.5 分类型E

#cf1322、#d4380d、#d46b08、#d48806、#d4b106、#7cb305、#389e0d、#08979c、#0958d9、#1d39c4、#531dab、#c41d7f

3.6 顺序型A

#ff7875、#ff4d4f、#f5222d、#cf1322、#a8071a、#820014、#5c0011

3.7 顺序型B

#ffc069、#ffa940、#fa8c16、#d46b08、#ad4e00、#873800、#612500

3.8 顺序型C

#95de64、#73d13d、#52c41a、#389e0d、#237804、#135200、#092b00

3.9 顺序型D

#5cdbd3、#36cfc9、#13c2c2、#08979c、#006d75、#00474f、#002329

3.10 顺序型E

#69b1ff、#4096ff、#1677ff、#0958d9、#003eb3、#002c8c、#001d66

3.11 顺序型F

#ff85c0、#f759ab、#eb2f96、#c41d7f、#9e1068、#780650、#520339

3.12 语义型A

Success、processing、error、warning、default

3.13 语义型B

#1890ff、#52c41a、#faad14、#ff4d4f

四、使用建议

1.类型只使用两种,根据系统主题色的色调（相对明暗程度）选择“分类型A” + 另一种

2.顺序型也只使用两、三种，根据系统主题色的色相选择：邻近色、对比色与互补色

3.语义型根据实际情况使用即可