# 色彩
系统级色彩体系主要定义了中台设计中的基础色板、中性色板和数据可视化色板。产品级色彩体系则是在具体设计过程中，基于系统色彩进一步定义符合产品调性以及功能诉求的颜色。
# 基础色板
MyWeb 4.x 使用 Ant Design (opens new window) 提供的的基础色板。共计 120 个颜色，包含 12 个主色以及衍生色。这些颜色基本可以满足中后台设计中对于颜色的需求。
Dust Red / 薄暮
斗志、奔放
$red-primary
#f5222d
$red-1
#5c0011
$red-2
#820014
$red-3
#a8071a
$red-4
#cf1322
$red-5
#f5222d
$red-6
#ff4d4f
$red-7
#ff7875
$red-8
#ffa39e
$red-9
#ffccc7
$red-10
#fff1f0
Volcano / 火山
醒目、澎湃
$volcano-primary
#fa541c
$volcano-1
#610b00
$volcano-2
#871400
$volcano-3
#ad2102
$volcano-4
#d4380d
$volcano-5
#fa541c
$volcano-6
#ff7a45
$volcano-7
#ff9c6e
$volcano-8
#ffbb96
$volcano-9
#ffd8bf
$volcano-10
#fff2e8
Sunset Orange / 日暮
温暖、欢快
$orange-primary
#fa8c16
$orange-1
#612500
$orange-2
#873800
$orange-3
#ad4e00
$orange-4
#d46b08
$orange-5
#fa8c16
$orange-6
#ffa940
$orange-7
#ffc069
$orange-8
#ffd591
$orange-9
#ffe7ba
$orange-10
#fff7e6
Calendula Gold / 金盏花
活力、积极
$gold-primary
#faad14
$gold-1
#613400
$gold-2
#874d00
$gold-3
#ad6800
$gold-4
#d48806
$gold-5
#faad14
$gold-6
#ffc53d
$gold-7
#ffd666
$gold-8
#ffe58f
$gold-9
#fff1b8
$gold-10
#fffbe6
Sunrise Yellow / 日出
出生、阳光
$yellow-primary
#fadb14
$yellow-1
#614700
$yellow-2
#876800
$yellow-3
#ad8b00
$yellow-4
#d4b106
$yellow-5
#fadb14
$yellow-6
#ffec3d
$yellow-7
#fff566
$yellow-8
#fffb8f
$yellow-9
#ffffb8
$yellow-10
#feffe6
Lime / 青柠
自然、生机
$lime-primary
#a0d911
$lime-1
#254000
$lime-2
#3f6600
$lime-3
#5b8c00
$lime-4
#7cb305
$lime-5
#a0d911
$lime-6
#bae637
$lime-7
#d3f261
$lime-8
#eaff8f
$lime-9
#f4ffb8
$lime-10
#fcffe6
Polar Green / 极光绿
健康、创新
$green-primary
#52c41a
$green-1
#092b00
$green-2
#135200
$green-3
#237804
$green-4
#389e0d
$green-5
#52c41a
$green-6
#73d13d
$green-7
#95de64
$green-8
#b7eb8f
$green-9
#d9f7be
$green-10
#f6ffed
Cyan / 明青
希望、坚强
$cyan-primary
#13c2c2
$cyan-1
#002329
$cyan-2
#00474f
$cyan-3
#006d75
$cyan-4
#08979c
$cyan-5
#13c2c2
$cyan-6
#36cfc9
$cyan-7
#5cdbd3
$cyan-8
#87e8de
$cyan-9
#b5f5ec
$cyan-10
#e6fffb
Daybreak Blue / 拂晓蓝
包容、科技、普惠
$blue-primary
#1890ff
$blue-1
#002766
$blue-2
#003a8c
$blue-3
#0050b3
$blue-4
#096dd9
$blue-5
#1890ff
$blue-6
#40a9ff
$blue-7
#69c0ff
$blue-8
#91d5ff
$blue-9
#bae7ff
$blue-10
#e6f7ff
Geek Blue / 极客蓝
探索、钻研
$geekblue-primary
#2f54eb
$geekblue-1
#030852
$geekblue-2
#061178
$geekblue-3
#10239e
$geekblue-4
#1d39c4
$geekblue-5
#2f54eb
$geekblue-6
#597ef7
$geekblue-7
#85a5ff
$geekblue-8
#adc6ff
$geekblue-9
#d6e4ff
$geekblue-10
#f0f5ff
Golden Purple / 酱紫
优雅、浪漫
$purple-primary
#722ed1
$purple-1
#120338
$purple-2
#22075e
$purple-3
#391085
$purple-4
#531dab
$purple-5
#722ed1
$purple-6
#9254de
$purple-7
#b37feb
$purple-8
#d3adf7
$purple-9
#efdbff
$purple-10
#f9f0ff
Magenta / 法式洋红
明快、感性
$magenta-primary
#eb2f96
$magenta-1
#520339
$magenta-2
#780650
$magenta-3
#9e1068
$magenta-4
#c41d7f
$magenta-5
#eb2f96
$magenta-6
#f759ab
$magenta-7
#ff85c0
$magenta-8
#ffadd2
$magenta-9
#ffd6e7
$magenta-10
#fff0f6
Grey / 灰度
中性
$grey-primary
#666666
$grey-1
#000000
$grey-2
#000000
$grey-3
#1a1a1a
$grey-4
#404040
$grey-5
#666666
$grey-6
#737373
$grey-7
#808080
$grey-8
#8c8c8c
$grey-9
#999999
$grey-10
#a6a6a6
# 中性色板
MyWeb 4.x 的中性色主要被大量的应用在界面的文字部分，此外背景、边框、分割线、等场景中也非常常见。 产品中性色的定义需要考虑深色背景以及浅色背景的差异，同时结合 WCAG 2.0 标准。 MyWeb 4.x 的中性色在落地的时候是按照透明度的方式实现的，具体色板如下：
深色背景
$neutral-white-1
rgba(255, 255, 255, 1)
$neutral-white-2
rgba(255, 255, 255, 0.85)
$neutral-white-3
rgba(255, 255, 255, 0.65)
$neutral-white-4
rgba(255, 255, 255, 0.45)
$neutral-white-5
rgba(255, 255, 255, 0.25)
$neutral-white-6
rgba(255, 255, 255, 0.15)
$neutral-white-7
rgba(255, 255, 255, 0.09)
$neutral-white-8
rgba(255, 255, 255, 0.04)
$neutral-white-9
rgba(255, 255, 255, 0.02)
$neutral-white-10
rgba(255, 255, 255, 0)
浅色背景
$neutral-black-1
rgba(0, 0, 0, 1)
$neutral-black-2
rgba(0, 0, 0, 0.85)
$neutral-black-3
rgba(0, 0, 0, 0.65)
$neutral-black-4
rgba(0, 0, 0, 0.45)
$neutral-black-5
rgba(0, 0, 0, 0.25)
$neutral-black-6
rgba(0, 0, 0, 0.15)
$neutral-black-7
rgba(0, 0, 0, 0.09)
$neutral-black-8
rgba(0, 0, 0, 0.04)
$neutral-black-9
rgba(0, 0, 0, 0.02)
$neutral-black-10
rgba(0, 0, 0, 0)