组件

色彩

为了更加易于操作和人性化而设计出的标识特定功能的图形标志。

基础色板 #

ZR基础色板一共8个,这些颜色基本可以满足中后台设计中对于颜色的需求。
此色板还具备进一步拓展的能力,结合了色彩自然变化的规律,获得一套色彩生成工具,当有进一步色彩设计需求时,设计者只需按照一定规则定义完毕主色,便可以自动获得一系列完整的衍生色。
  1. JD RED 1#FFEFEC
  2. JD RED 2#FFCDC2
  3. JD RED 3#FFA899
  4. JD RED 4#FC7F6F
  5. JD RED 5#F15142
  6. JD RED 6#E2231A
  7. JD RED 7#BD190C
  8. JD RED 8#961205
  9. JD RED 9#700A07
  10. JD RED 10#4A0506
  1. ORANGE 1#FFF8E6
  2. ORANGE 2#FFE2A4
  3. ORANGE 3#FFD37A
  4. ORANGE 4#FFBF53
  5. ORANGE 5#FFA92A
  6. ORANGE 6#FF9101
  7. ORANGE 7#D97402
  8. ORANGE 8#B35A01
  9. ORANGE 9#8B4102
  10. ORANGE 10#662C00
  1. YELLOW 1#FDFEE6
  2. YELLOW 2#FDFDA4
  3. YELLOW 3#FFFC79
  4. YELLOW 4#FEF951
  5. YELLOW 5#FEF128
  6. YELLOW 6#FFE600
  7. YELLOW 7#D9BC02
  8. YELLOW 8#B39501
  9. YELLOW 9#8B7001
  10. YELLOW 10#654D01
  1. GREEN 1#F7FEE6
  2. GREEN 2#DFFCA4
  3. GREEN 3#C3EF75
  4. GREEN 4#A5E34B
  5. GREEN 5#89D624
  6. GREEN 6#6CC902
  7. GREEN 7#51A202
  8. GREEN 8#397C00
  9. GREEN 9#265700
  10. GREEN 10#143001
  1. CYANN 1#D3EBE8
  2. CYANN 2#A2DED9
  3. CYANN 3#77D1CD
  4. CYANN 4#51C4C2
  5. CYANN 5#2EB5B8
  6. CYANN 6#10A5AC
  7. CYANN 7#057A85
  8. CYANN 8#00535E
  9. CYANN 9#003038
  10. CYANN 10#000F12
  1. ZR BLUE 1#F0F6FF
  2. ZR BLUE 2#E8EFFF
  3. ZR BLUE 3#BFD1FF
  4. ZR BLUE 4#96B1FF
  5. ZR BLUE 5#6E8DFF
  6. ZR BLUE 6#4363F4
  7. ZR BLUE 7#2E45D0
  8. ZR BLUE 8#1D2DA7
  9. ZR BLUE 9#101A81
  10. ZR BLUE 10#0A0D5C
  1. BLUE 1#EBFAFF
  2. BLUE 2#C3EEFF
  3. BLUE 3#99E0FE
  4. BLUE 4#6FCBFC
  5. BLUE 5#42AEF1
  6. BLUE 6#1A90E2
  7. BLUE 7#0D6DBE
  8. BLUE 8#034F96
  9. BLUE 9#00366F
  10. BLUE 10#00224B
  1. PURPLE 1#F5E9FF
  2. PURPLE 2#E0BFFF
  3. PURPLE 3#C896FE
  4. PURPLE 4#AC6BFA
  5. PURPLE 5#883FEE
  6. PURPLE 6#642DE1
  7. PURPLE 7#4724BA
  8. PURPLE 8#301994
  9. PURPLE 9#1F106E
  10. PURPLE 10#130747

中性色板 #

中性色包含黑、白、灰,是页面设计中最常用的颜色,色板包含10个不同灰度的中性色。
  1. GREY 1#F5E9FF
  2. GREY 2#E0BFFF
  3. GREY 3#C896FE
  4. GREY 4#AC6BFA
  5. GREY 5#883FEE
  6. GREY 6#642DE1
  7. GREY 7#4724BA
  8. GREY 8#301994
  9. GREY 9#1F106E
  10. GREY 10#130747

自定义色板 #

除了色板定义的8种颜色,设计师可以自定义生成自己色板。
  1. ZR BLUE 1#F0F6FF
  2. ZR BLUE 2#E8EFFF
  3. ZR BLUE 3#BFD1FF
  4. ZR BLUE 4#96B1FF
  5. ZR BLUE 5#6E8DFF
  6. ZR BLUE 6#4363F4
  7. ZR BLUE 7#2E45D0
  8. ZR BLUE 8#1D2DA7
  9. ZR BLUE 9#101A81
  10. ZR BLUE 10#0A0D5C

色彩使用规范 #

在我们的色板算法中,每一种颜色都将衍生出10个色阶,而每一种色阶都可以定义它所对应的状态,主要的使用如下图所示。
颜色规范示例
每一种颜色的6号色都为其色系的标准色