# IconFont 图标

- accessory
  #icon-accessory
- activity
  #icon-activity
- activity_fill
  #icon-activity_fill
- add
  #icon-add
- addition_fill
  #icon-addition_fill
- addition
  #icon-addition
- addpeople_fill
  #icon-addpeople_fill
- addpeople
  #icon-addpeople
- addressbook_fill
  #icon-addressbook_fill
- addressbook
  #icon-addressbook
- barrage_fill
  #icon-barrage_fill
- barrage
  #icon-barrage
- browse_fill
  #icon-browse_fill
- browse
  #icon-browse
- brush
  #icon-brush
- brush_fill
  #icon-brush_fill
- businesscard_fill
  #icon-businesscard_fill
- businesscard
  #icon-businesscard
- camera_fill
  #icon-camera_fill
- camera
  #icon-camera
- clock_fill
  #icon-clock_fill
- clock
  #icon-clock
- close
  #icon-close
- collection_fill
  #icon-collection_fill
- collection
  #icon-collection
- computer_fill
  #icon-computer_fill
- computer
  #icon-computer
- coordinates_fill
  #icon-coordinates_fill
- coordinates
  #icon-coordinates
- coupons_fill
  #icon-coupons_fill
- coupons
  #icon-coupons
- createtask_fill
  #icon-createtask_fill
- createtask
  #icon-createtask
- customerservice_fill
  #icon-customerservice_fill
- customerservice
  #icon-customerservice
- delete_fill
  #icon-delete_fill
- delete
  #icon-delete
- document
  #icon-document
- document_fill
  #icon-document_fill
- dynamic_fill
  #icon-dynamic_fill
- dynamic
  #icon-dynamic
- editor
  #icon-editor
- eit
  #icon-eit
- emoji_fill
  #icon-emoji_fill
- emoji
  #icon-emoji
- empty
  #icon-empty
- empty_fill
  #icon-empty_fill
- enter
  #icon-enter
- enterinto
  #icon-enterinto
- enterinto_fill
  #icon-enterinto_fill
- feedback_fill
  #icon-feedback_fill
- feedback
  #icon-feedback
- flag_fill
  #icon-flag_fill
- flag
  #icon-flag
- flashlight
  #icon-flashlight
- flashlight_fill
  #icon-flashlight_fill
- flip
  #icon-flip
- flip_fill
  #icon-flip_fill
- fullscreen
  #icon-fullscreen
- group
  #icon-group
- group_fill
  #icon-group_fill
- headlines_fill
  #icon-headlines_fill
- headlines
  #icon-headlines
- homepage_fill
  #icon-homepage_fill
- homepage
  #icon-homepage
- integral_fill
  #icon-integral_fill
- integral
  #icon-integral
- interactive_fill
  #icon-interactive_fill
- interactive
  #icon-interactive
- keyboard
  #icon-keyboard
- label
  #icon-label
- label_fill
  #icon-label_fill
- like_fill
  #icon-like_fill
- like
  #icon-like
- live_fill
  #icon-live_fill
- live
  #icon-live
- lock_fill
  #icon-lock_fill
- lock
  #icon-lock
- mail
  #icon-mail
- mail_fill
  #icon-mail_fill
- manage_fill
  #icon-manage_fill
- manage
  #icon-manage
- message
  #icon-message
- message_fill
  #icon-message_fill
- mine
  #icon-mine
- mine_fill
  #icon-mine_fill
- mobilephone_fill
  #icon-mobilephone_fill
- mobilephone
  #icon-mobilephone
- more
  #icon-more
- narrow
  #icon-narrow
- offline_fill
  #icon-offline_fill
- offline
  #icon-offline
- order_fill
  #icon-order_fill
- order
  #icon-order
- other
  #icon-other
- people_fill
  #icon-people_fill
- people
  #icon-people
- picture_fill
  #icon-picture_fill
- picture
  #icon-picture
- play
  #icon-play
- play_fill
  #icon-play_fill
- playon_fill
  #icon-playon_fill
- playon
  #icon-playon
- praise_fill
  #icon-praise_fill
- praise
  #icon-praise
- prompt_fill
  #icon-prompt_fill
- prompt
  #icon-prompt
- qrcode_fill
  #icon-qrcode_fill
- qrcode
  #icon-qrcode
- redpacket_fill
  #icon-redpacket_fill
- redpacket
  #icon-redpacket
- refresh
  #icon-refresh
- remind_fill
  #icon-remind_fill
- remind
  #icon-remind
- return
  #icon-return
- right
  #icon-right
- scan
  #icon-scan
- select_fill
  #icon-select_fill
- select
  #icon-select
- send
  #icon-send
- service_fill
  #icon-service_fill
- service
  #icon-service
- setup_fill
  #icon-setup_fill
- setup
  #icon-setup
- share_fill
  #icon-share_fill
- share
  #icon-share
- shielding_fill
  #icon-shielding_fill
- shielding
  #icon-shielding
- smallscreen_fill
  #icon-smallscreen_fill
- smallscreen
  #icon-smallscreen
- stealth_fill
  #icon-stealth_fill
- stealth
  #icon-stealth
- success_fill
  #icon-success_fill
- success
  #icon-success
- suspend
  #icon-suspend
- switch
  #icon-switch
- systemprompt_fill
  #icon-systemprompt_fill
- systemprompt
  #icon-systemprompt
- tailor
  #icon-tailor
- task
  #icon-task
- task_fill
  #icon-task_fill
- tasklist_fill
  #icon-tasklist_fill
- tasklist
  #icon-tasklist
- text
  #icon-text
- time_fill
  #icon-time_fill
- time
  #icon-time
- translation_fill
  #icon-translation_fill
- translation
  #icon-translation
- trash
  #icon-trash
- trash_fill
  #icon-trash_fill
- undo
  #icon-undo
- unlock_fill
  #icon-unlock_fill
- unlock
  #icon-unlock
- video
  #icon-video
- video_fill
  #icon-video_fill
- warning_fill
  #icon-warning_fill
- warning
  #icon-warning
- workbench_fill
  #icon-workbench_fill
- workbench
  #icon-workbench
- search
  #icon-search
- search fill
  #icon-searchfill
- qianriu_fill
  #icon-qianniu
- publish goods_fill
  #icon-publishgoods_fill
- shop_fill
  #icon-shop_fill
- transaction_fill
  #icon-transaction_fill
- packup
  #icon-packup
- unfold
  #icon-unfold
- wangwang_fill
  #icon-wangwang
- financial_fill
  #icon-financial_fill
- marketing_fill
  #icon-marketing_fill
- shake
  #icon-shake
- decoration_fill
  #icon-decoration_fill
- logo
  #icon-budaidise
- logo_fill
  #icon-qianniudaidise
- questions
  #icon-questions
- supply
  #icon-supply
- tools
  #icon-tools
- int_fill
  #icon-int

## symbol引用

这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇文章 这种用法其实是做了一个svg的集合，与另外两种相比具有如下特点：

- 支持多色图标了，不再受单色限制。
- 通过一些技巧，支持像字体那样，通过`font-size`,`color`来调整样式。
- 兼容性较差，支持 ie9+,及现代浏览器。
- 浏览器渲染svg的性能一般，还不如png。

使用步骤如下：

### 第一步：引入项目下面生成的symbol代码：

    <script src="./iconfont.js"></script>

### 第二步：加入通用css代码（引入一次就行）：

    <style type="text/css">
    .icon {
       width: 1em; height: 1em;
       vertical-align: -0.15em;
       fill: currentColor;
       overflow: hidden;
    }
    </style>

### 第三步：挑选相应图标并获取类名，应用于页面：

    <svg class="icon" aria-hidden="true">
      <use xlink:href="#icon-xxx"></use>
    </svg>