图标

ICON

图标库

地址 https://www.remixicon.cn

开发、使用中遇到remixicon图标库里不存在的icon时，可以使用图标库之外的icon，但要注意风格、样式的统一性。

图标类型

线性 面性

在同区块或组中，统一使用线性或面性图标，保持风格统一。

图标尺寸

说明 示例 使用场景

icon size:14px

font size:14px
图标应用在按钮和表单时，与文字同等大小。（以美观度为前提可适当调整图标大小）

图标颜色

功能图标
  1. 1 #1890FF
  2. 2 #1890FF
  3. 3 #C2C4CC
  4. 4 #EF5757
  5. 5 #60B971
  6. 6 #F68330
  7. 7 #C2C4CC
  8. 8 #E1E2E5
  9. 9 #797A80
功能图标通常有对应的颜色（图标颜色不完全固定，以实际功能为准）
装饰图标
  1. 1 #1F1F1F
  2. 2 #797A80
图标出现在文本附近时，图标颜色可以与临近文本颜色一致。
  1. 1 rgba(255,255,255,.6)
  2. 2 #FFFFFF

使用注意事项

 正确示范  错误示范

1、页面同一模块或组中只允许使用同一种风格图标；

2、同类型图标的规格/风格高度统一。

 同一模块或组中线性和面性图标两种风格不能同时使用。

图标类型的使用要统一。

特殊说明

图标点击区域
示例 说明
在开发实现时，考虑单独icon交互点击的易操作性，可将图标四周外扩6px作为点击作用区域。
任何按钮的点击区域都应与其外观相符，而不只是在文字区域。