主色

蓝色--ct-color-blue

#4D64FF

黄色--ct-color-yellow

#FFAD2C

绿色--ct-color-green

#1EB7AD

紫色--ct-color-purple

#664FFF

橙色--ct-color-orange

#FF9218

天蓝--ct-color-sky

#42A6FF

橘红--ct-color-red

#FF643E

草绿--ct-color-grass

#88CE77

辅色

辅色-蓝色--ct-color-sub-blue

#3A45FF

辅色-紫色--ct-color-sub-purple

#7B4CF4

中性色

标准黑--ct-color-black

#141617

辅助灰--ct-color-grey-sub

#535C66

过渡灰--ct-color-grey-transition

#8F99A3

提示灰/边框色--ct-color-grey-tip

#A4AFBB

分隔线--ct-color-separator

#D8DEE8

背景色--ct-color-bg

#F0F3F9

状态色

主色--ct-color-primary

#4D64FF

主色边框色--ct-color-primary-border

#B1BBFF

主色背景色--ct-color-primary-bg

#ECF1FF

危险色--ct-color-danger

#FF4D4D

危险色边框色--ct-color-danger-border

#FFA39E

危险色背景色--ct-color-danger-bg

#FFF1F0

警告色--ct-color-warning

#FFAD2C

警告色边框色--ct-color-warning-border

#FFD28B

警告色背景色--ct-color-warning-bg

#FFFBE6

成功色--ct-color-success

#07C47E

成功色边框色--ct-color-success-border

#9BE0CA

成功色背景色--ct-color-success-bg

#F1FDF9

边框样式

深色 1px#A4AFBB--ct-border-color

浅色 1px#D8DEE8--ct-border-color-light

圆角

小圆角2px

--ct-border-radius-s

中圆角4px

--ct-border-radius

大圆角6px

--ct-border-radius-l

文字

字体

系统	英文	数字	中文
MAC	Helvetica Neue	Helvetica Neue	PingFang SC
Windows	Arial	Arial	Microsoft YaHei

font-family: 'Helvetica Neue','PingFang SC',Arial,'Microsoft YaHei',WenQuanYiMicroHei;

字重

TIP

因微软雅黑没有500对应字重，故此字重不建议使用（内嵌字体包除外）

样式	代码	字重（以苹方为例）
创造前所未有的数据价值，推动行业和社会进步	400	Regular
创造前所未有的数据价值，推动行业和社会进步	500	Medium
创造前所未有的数据价值，推动行业和社会进步	600	Semibold

字号

样式	字号	名称	变量名
创造前所未有的数据价值，推动行业和社会进步	12	标签字号	--ct-font-label
创造前所未有的数据价值，推动行业和社会进步	13	特殊应用	--ct-font-special
创造前所未有的数据价值，推动行业和社会进步	14	常用字号-小（默认）	--ct-font-size
创造前所未有的数据价值，推动行业和社会进步	15	常用字号-大	--ct-font-large
创造前所未有的数据价值，推动行业和社会进步	16	标题-小	--ct-font-title-s
创造前所未有的数据价值，推动行业和社会进步	17	标题-中	--ct-font-title-m
创造前所未有的数据价值，推动行业和社会进步	18	标题-大	--ct-font-title-l
创造前所未有的数据价值，推动行业和社会进步	19	系统标题-小	--ct-font-system-s
创造前所未有的数据价值，推动行业和社会进步	20	系统标题-大	--ct-font-system-l