# 颜色
Antd 色彩规范
安装 @lateinos/theme-pc
展示的色值及对应Less变量均提供一键复制功能
- 蓝湖设计稿地址：颜色 (opens new window)
当前选中的版本：
# 业务色
#315EFB
h3-blue
#FF3640
h3-red
#FFAF06
h3-yellow
#0ABF5B
h3-green
#FF9D00
h3-orange
#ED3198
h3-pink
#7D32E6
h3-purple
#52C41A
h3-polar-green
#23B7FF
h3-light-blue
#8C25B1
h3-golden-purple
#887CED
h3-light-purple
#FB6A85
h3-dust-red
#FFA632
h3-volcano-orange
#3A67D7
h3-geek-blue
#0CC8C8
h3-cyan
#56CD69
h3-bluish-green
#2DBEF7
h3-daybreak-blue
# 中性色
#121933
一级黑
h3-black-7
#707481
二级黑
h3-black-6
#BBBECA
三级黑
h3-black-4
# 字体颜色(文字)
#121933
标题正文
一级黑
h3-text-color
#707481
浅色正文
二级黑
h3-text-color-light
#BBBECA
弱色正文
三级黑
h3-text-color-light-2
#000
全黑
h3-text-color-dark
#BBBECA
限定状态
水印、提示、失效、禁用图标默认
h3-text-color-disabled
#315EFB
主色调
主色调用于文本
h3-text-color-primary
# 功能色
# 主色调
#315EFB
主色调
用于按钮、文字、图标、链接等
h3-primary-color
#FF3640
Error
用于危险按钮、检验提示
h3-error-color
#0ABF5B
Success
用于成功提示
h3-success-color
#FF9D00
Warning
用于警告提示
h3-warning-color
#315EFB
Info
用于信息提示
h3-info-color
# 修饰色
#F3F6F9
背景色
用于灰色背景
h3-normal-color
#E9E9EB
分割线
内容分隔线、Tab页签分割线
h3-line-color
#EBECEE
表格分割、边框线
表格分割、边框线
h3-table-border-color
#FAFBFB
斑马线
表格斑马线
h3-zebra-crossing-color
#F5F6F9
下拉hover
下拉菜单悬停背景色
h3-option-hover-color
#EEF1FF
下拉active
下拉菜单选中背景色
h3-option-active-color
#d5e8ff
阴影
用于卡片阴影
h3-shadow-color
rgba(51, 93, 182, 0.2)
暗色阴影
用于弹窗或浮层阴影
h3-dark-shadow-color
rgba(0,0, 0 , 0.5)
黑色蒙层
黑色蒙层
h3-blackmask-bg-color
#F4F5F7
浅灰
页面/表格表头(默认)表格行选中
h3-table-select
# 色板
Antd 色彩规范
Antd 的色板体系，可以查看 Antd 的官方解释：基础色板 (opens new window)。
要从技术上理解色板的实现，可以查看色板的实现库：@ant-design/colors (opens new window)。
以及 Antd 社区的文章： Ant Design 色板生成算法演进之路 (opens new window)
奥哲颜色规范
色板概念是继承于 Ant Design 中的设计理念，奥哲的标准颜色与 Antd 中不同，但色板的设计将沿用 Antd。
确定一个主色，由色板体系自动生成 10 个衍生色。 奥哲经过业务沉淀后，确定了以下业务色(涵盖了 4 种标准色),
其中黑色是根据蓝湖设计规范的自定义色盘(非自动生成)
# 主色调色板
- h3-blue-1 #f0f6ff
- h3-blue-2 #d6e4ff
- h3-blue-3 #adc7ff
- h3-blue-4 #85a7ff
- h3-blue-5 #5c85ff
- h3-blue-6 #315efb
- h3-blue-7 #2041d4
- h3-blue-8 #1129ad
- h3-blue-9 #071687
- h3-blue-10 #040c61
- h3-red-1 #fff1f0
- h3-red-2 #ffdcd9
- h3-red-3 #ffb4b0
- h3-red-4 #ff8987
- h3-red-5 #ff5e61
- h3-red-6 #ff3640
- h3-red-7 #d92332
- h3-red-8 #b31426
- h3-red-9 #8c081c
- h3-red-10 #660517
- h3-green-1 #e6ffed
- h3-green-2 #a7f2bf
- h3-green-3 #7ae69f
- h3-green-4 #50d985
- h3-green-5 #2bcc6e
- h3-green-6 #0abf5b
- h3-green-7 #00994a
- h3-green-8 #00733b
- h3-green-9 #004d2a
- h3-green-10 #002616
- h3-yellow-1 #fffbe6
- h3-yellow-2 #ffefa8
- h3-yellow-3 #ffe380
- h3-yellow-4 #ffd557
- h3-yellow-5 #ffc42e
- h3-yellow-6 #ffaf06
- h3-yellow-7 #d98d00
- h3-yellow-8 #b36e00
- h3-yellow-9 #8c5200
- h3-yellow-10 #663800
# 业务色板
- h3-black-1 #ecf0f6
- h3-black-2 #e3e6ec
- h3-black-3 #ced4dd
- h3-black-4 #BBBECA
- h3-black-5 #8e96a4
- h3-black-6 #707481
- h3-black-7 #121933
- h3-black-8 #000
- h3-black-9 #000
- h3-black-10 #000
- h3-blue-1 #f0f6ff
- h3-blue-2 #d6e4ff
- h3-blue-3 #adc7ff
- h3-blue-4 #85a7ff
- h3-blue-5 #5c85ff
- h3-blue-6 #315efb
- h3-blue-7 #2041d4
- h3-blue-8 #1129ad
- h3-blue-9 #071687
- h3-blue-10 #040c61
- h3-red-1 #fff1f0
- h3-red-2 #ffdcd9
- h3-red-3 #ffb4b0
- h3-red-4 #ff8987
- h3-red-5 #ff5e61
- h3-red-6 #ff3640
- h3-red-7 #d92332
- h3-red-8 #b31426
- h3-red-9 #8c081c
- h3-red-10 #660517
- h3-yellow-1 #fffbe6
- h3-yellow-2 #ffefa8
- h3-yellow-3 #ffe380
- h3-yellow-4 #ffd557
- h3-yellow-5 #ffc42e
- h3-yellow-6 #ffaf06
- h3-yellow-7 #d98d00
- h3-yellow-8 #b36e00
- h3-yellow-9 #8c5200
- h3-yellow-10 #663800
- h3-green-1 #e6ffed
- h3-green-2 #a7f2bf
- h3-green-3 #7ae69f
- h3-green-4 #50d985
- h3-green-5 #2bcc6e
- h3-green-6 #0abf5b
- h3-green-7 #00994a
- h3-green-8 #00733b
- h3-green-9 #004d2a
- h3-green-10 #002616
- h3-orange-1 #fff9e6
- h3-orange-2 #ffe8a3
- h3-orange-3 #ffd97a
- h3-orange-4 #ffc852
- h3-orange-5 #ffb429
- h3-orange-6 #ff9d00
- h3-orange-7 #d97e00
- h3-orange-8 #b36200
- h3-orange-9 #8c4800
- h3-orange-10 #663100
- h3-pink-1 #fff0f6
- h3-pink-2 #ffd9e9
- h3-pink-3 #ffb0d4
- h3-pink-4 #ff87c1
- h3-pink-5 #fa5cae
- h3-pink-6 #ed3198
- h3-pink-7 #c72081
- h3-pink-8 #a1126a
- h3-pink-9 #7a0752
- h3-pink-10 #54043b
- h3-purple-1 #f9f0ff
- h3-purple-2 #efdbff
- h3-purple-3 #dab3ff
- h3-purple-4 #c28aff
- h3-purple-5 #a05cf2
- h3-purple-6 #7d32e6
- h3-purple-7 #5d21bf
- h3-purple-8 #411299
- h3-purple-9 #2a0873
- h3-purple-10 #19054d
- h3-polar-green-1 #f6ffed
- h3-polar-green-2 #d9f7be
- h3-polar-green-3 #b7eb8f
- h3-polar-green-4 #95de64
- h3-polar-green-5 #73d13d
- h3-polar-green-6 #52c41a
- h3-polar-green-7 #389e0d
- h3-polar-green-8 #237804
- h3-polar-green-9 #135200
- h3-polar-green-10 #092b00
- h3-light-blue-1 #f0fcff
- h3-light-blue-2 #c7f4ff
- h3-light-blue-3 #9ee8ff
- h3-light-blue-4 #75daff
- h3-light-blue-5 #4dc9ff
- h3-light-blue-6 #23b7ff
- h3-light-blue-7 #1490d9
- h3-light-blue-8 #076eb3
- h3-light-blue-9 #004f8c
- h3-light-blue-10 #003666
# 应用图标色
#8C25B1
h3-golden-purple
#887CED
h3-light-purple
#FB6A85
h3-dust-red
#FFA632
h3-volcano-orange
#3A67D7
h3-geek-blue
#0CC8C8
h3-cyan
#56CD69
h3-bluish-green
#2DBEF7
h3-daybreak-blue
# 渐变色
h3-gradual-golden-purple
h3-gradual-light-purple
h3-gradual-dust-red
h3-gradual-volcano-orange
h3-gradual-geek-blue
h3-gradual-cyan
h3-gradual-bluish-green
h3-gradual-daybreak-blue