#

- 
  favourites-filled-star-symbol
  &#xe669;
- 
  转发
  &#xe668;
- 
  小程序-联系我们icon
  &#xe695;
- 
  小程序-参观登记icon
  &#xe694;
- 
  小程序-人气icon
  &#xe693;
- 
  小程序-浮标管理icon
  &#xe692;
- 
  小程序-条款管理icon
  &#xe690;
- 
  小程序-广告管理icon
  &#xe691;
- 
  小程序-弹窗管理icon
  &#xe68f;
- 
  小程序-投票icon
  &#xe68e;
- 
  小程序-观众预登记icon
  &#xe68d;
- 
  小程序-个人中心icon
  &#xe68c;
- 
  小程序-交通指南icon
  &#xe68b;
- 
  小程序-观众指南icon
  &#xe68a;
- 
  小程序-展馆平面图icon
  &#xe689;
- 
  小程序-展商名录icon
  &#xe688;
- 
  小程序-关于展会icon
  &#xe687;
- 
  企业海报定制icon
  &#xe686;
- 
  下载中心icon
  &#xe685;
- 
  贵宾观众邀请icon
  &#xe683;
- 
  胸卡申请icon
  &#xe682;
- 
  展台活动icon
  &#xe681;
- 
  展商新闻icon
  &#xe680;
- 
  展品资料icon
  &#xe67f;
- 
  展商中心总览icon
  &#xe67e;
- 
  展商信息icon
  &#xe67d;
- 
  新闻
  &#xe667;
- 
  消息
  &#xe726;
- 
  right icon_画板 1
  &#xe679;
- 
  right icon_画板 1-copy-copy
  &#xee4e;
- 
  right icon_画板 1-copy
  &#xee4a;
- 
  right icon_画板 1-copy
  &#xee4b;
- 
  wechat-fill
  &#xe885;
- 
  领英
  &#xee48;
- 
  Top 100
  &#xe666;
- 
  企业库
  &#xe665;
- 
  公司库
  &#xe664;
- 
  Record
  &#xe87c;
- 
  Registration
  &#xe87d;
- 
  Pause-Circle
  &#xe87e;
- 
  Bookmark
  &#xe87f;
- 
  Bookmark-Filled
  &#xe880;
- 
  Sound
  &#xe881;
- 
  Map
  &#xe837;
- 
  Route
  &#xe838;
- 
  Print
  &#xe83a;
- 
  Transport
  &#xe83b;
- 
  Edit
  &#xe842;
- 
  GeoLocation
  &#xe851;
- 
  Share
  &#xe863;
- 
  Search
  &#xe86f;
- 
  BookmarkCheck
  &#xe87a;
- 
  Archive
  &#xe835;
- 
  Play-Circle
  &#xe87b;
- 
  Vector
  &#xe662;
- 
  Placeholder-Icon
  &#xe663;
- 
  Favourites-Add-Alt-Large
  &#xe660;
- 
  Favourites-Add-Large
  &#xe661;
- 
  Mecial Mask
  &#xe65f;
- 
  Exclamation-Circle-Large-1
  &#xe883;
- 
  Checkmak-Circle-Large
  &#xe65d;
- 
  Exclamation-Circle-Large
  &#xe65e;
- 
  Calendar-No-Slots-Large
  &#xe65b;
- 
  Calendar-Add-Large
  &#xe65c;
- 
  Rocket-Launch-Large
  &#xe65a;
- 
  medium
  &#xe657;
- 
  icon-kfckfc
  &#xe658;
- 
  Vimeo
  &#xe659;
- 
  Thumb Up
  &#xe655;
- 
  Thumb Down
  &#xe656;
- 
  Soundcloud
  &#xe652;
- 
  Spotify
  &#xe653;
- 
  Deezer
  &#xe654;
- 
  icon-kfckfc
  &#xe64f;
- 
  Xing
  &#xe650;
- 
  Apple-Podcast
  &#xe651;
- 
  Podigee
  &#xe64e;
- 
  Instagram
  &#xe64b;
- 
  Facebook
  &#xe64c;
- 
  Registration 2
  &#xe64d;
- 
  Instagram
  &#xe646;
- 
  Facebook
  &#xe648;
- 
  YouTube-Block
  &#xe649;
- 
  YouTube
  &#xe64a;
- 
  Exhibitor
  &#xe642;
- 
  Chairman
  &#xe643;
- 
  AddContact
  &#xe644;
- 
  Group
  &#xe645;
- 
  DeleteContact
  &#xe647;
- 
  Profile
  &#xe641;
- 
  Contacts
  &#xe63e;
- 
  Speaker
  &#xe63f;
- 
  User-Placeholder
  &#xe640;
- 
  CalendarCheck
  &#xe63d;
- 
  Mobility
  &#xe638;
- 
  Car
  &#xe639;
- 
  Plane
  &#xe63a;
- 
  Train
  &#xe63b;
- 
  Bus
  &#xe63c;
- 
  HourglassFull
  &#xe637;
- 
  Clock
  &#xe636;
- 
  Calendar
  &#xe632;
- 
  CalendarPending
  &#xe633;
- 
  CalendarDelete
  &#xe634;
- 
  Date
  &#xe635;
- 
  CalendarAdd
  &#xe631;
- 
  CalendarAdd
  &#xe62d;
- 
  Wait
  &#xe62e;
- 
  Hourglass
  &#xe62f;
- 
  CalendarCheck
  &#xe630;
- 
  Unlocked
  &#xe62b;
- 
  Locked
  &#xe62c;
- 
  Flag
  &#xe62a;
- 
  Rocket
  &#xe623;
- 
  Present
  &#xe628;
- 
  Light
  &#xe629;
- 
  World
  &#xe624;
- 
  Award
  &#xe625;
- 
  Ticket
  &#xe626;
- 
  Beverages
  &#xe627;
- 
  Compass
  &#xe619;
- 
  Mountain
  &#xe61a;
- 
  Diamond
  &#xe61b;
- 
  Star-Filled
  &#xe61c;
- 
  Beer
  &#xe61d;
- 
  Food
  &#xe61e;
- 
  Shopping
  &#xe61f;
- 
  Star
  &#xe620;
- 
  megaphone
  &#xe621;
- 
  Heart
  &#xe622;
- 
  FilterHoriz
  &#xe618;
- 
  Exit
  &#xe60b;
- 
  Left-1
  &#xe884;
- 
  Center
  &#xe60c;
- 
  Down
  &#xe60d;
- 
  FullscreenExit
  &#xe60e;
- 
  Filter
  &#xe60f;
- 
  DownSmall
  &#xe610;
- 
  FullscreenEnter
  &#xe611;
- 
  LeftSmall
  &#xe612;
- 
  Grid
  &#xe613;
- 
  Left
  &#xe614;
- 
  PointMenu
  &#xe615;
- 
  PictureInPicture
  &#xe616;
- 
  BackToSource-1
  &#xe617;
- 
  Cancel-copy
  &#xee4c;
- 
  DotMenu
  &#xe607;
- 
  BurgerMenu
  &#xe608;
- 
  Cancel
  &#xe609;
- 
  DotMenuHoriz
  &#xe60a;
- 
  ArrowRight
  &#xe604;
- 
  ArrowLeft
  &#xe603;
- 
  BackToSource
  &#xe606;
- 
  ArrowUp
  &#xe605;
- 
  BackToSource-copy
  &#xe882;
- 
  ArrowDown
  &#xe602;
- 
  Apps
  &#xe601;
- 
  MailOpen
  &#xe84d;
- 
  Desktop
  &#xe86d;
- 
  Workshop
  &#xe867;
- 
  Presentation
  &#xe860;
- 
  Percent
  &#xe85f;
- 
  Cards
  &#xe879;
- 
  Card
  &#xe865;
- 
  Notification
  &#xe85a;
- 
  Icon (source)
  &#xe878;
- 
  Apple
  &#xe873;
- 
  Office365
  &#xe874;
- 
  Google-Calendar
  &#xe875;
- 
  ICS
  &#xe876;
- 
  Location=Placeholder
  &#xe877;
- 
  icon-kfckfc
  &#xe871;
- 
  icon-kfckfc
  &#xe872;
- 
  Size=180
  &#xe870;
- 
  Graph2
  &#xe862;
- 
  Graph
  &#xe864;
- 
  Hybrid
  &#xe866;
- 
  Chatbot
  &#xe868;
- 
  Mail
  &#xe869;
- 
  Inbox
  &#xe86a;
- 
  Fax
  &#xe86b;
- 
  Live
  &#xe86c;
- 
  VIP
  &#xe86e;
- 
  Briefcase
  &#xe852;
- 
  Alert
  &#xe853;
- 
  Y-Axis
  &#xe854;
- 
  NotificationsOff
  &#xe855;
- 
  Bill
  &#xe856;
- 
  VideoDisabled
  &#xe857;
- 
  Yahoo
  &#xe858;
- 
  Stop
  &#xe859;
- 
  Error
  &#xe85b;
- 
  Match
  &#xe85c;
- 
  Partners
  &#xe85d;
- 
  Fee
  &#xe85e;
- 
  Graph3
  &#xe861;
- 
  Message
  &#xe84a;
- 
  MailSent
  &#xe84b;
- 
  Smartphone
  &#xe84c;
- 
  Phone
  &#xe84e;
- 
  Senden
  &#xe84f;
- 
  Message-Filled
  &#xe850;
- 
  CheckCircle-Filled
  &#xe848;
- 
  Check
  &#xe849;
- 
  Attachment
  &#xe83c;
- 
  Folder
  &#xe83d;
- 
  Filled
  &#xe83e;
- 
  Blank
  &#xe83f;
- 
  Circle
  &#xe840;
- 
  Info
  &#xe841;
- 
  DownloadCompletet
  &#xe843;
- 
  Download
  &#xe844;
- 
  Delete
  &#xe845;
- 
  Copy
  &#xe846;
- 
  CheckCircle
  &#xe847;
- 
  Translate
  &#xe82e;
- 
  Volume-Mute
  &#xe82f;
- 
  Volume-Low
  &#xe831;
- 
  Typing
  &#xe832;
- 
  Volume
  &#xe833;
- 
  View
  &#xe834;
- 
  Video
  &#xe836;
- 
  Table
  &#xe839;
- 
  Building1
  &#xe82d;
- 
  Target
  &#xe827;
- 
  MapCluster
  &#xe828;
- 
  Home
  &#xe829;
- 
  Factory
  &#xe82a;
- 
  Building2
  &#xe82c;
- 
  Booth
  &#xe81e;
- 
  Upload
  &#xe81f;
- 
  Settings
  &#xe812;
- 
  Shuffle
  &#xe820;
- 
  Spinner
  &#xe821;
- 
  Reload
  &#xe822;
- 
  Replay
  &#xe823;
- 
  Link-Broken
  &#xe814;
- 
  Picture
  &#xe815;
- 
  Plus
  &#xe816;
- 
  Photo
  &#xe817;
- 
  Play
  &#xe819;
- 
  Pause
  &#xe81b;
- 
  Link
  &#xe81c;
- 
  Minus
  &#xe81d;
- 
  oe-a
  &#xe802;

## Unicode 引用

Unicode 是字体在网页端最原始的应用方式，特点是：

- 支持按字体的方式去动态调整图标大小，颜色等等。
- 默认情况下不支持多色，直接添加多色图标会自动去色。

> 注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）

Unicode 使用步骤如下：

### 第一步：拷贝项目下面生成的 `@font-face`

    @font-face {
      font-family: 'iconfont';
      src: url('iconfont.woff2?t=1730788484478') format('woff2'),
           url('iconfont.woff?t=1730788484478') format('woff'),
           url('iconfont.ttf?t=1730788484478') format('truetype'),
           url('iconfont.svg?t=1730788484478#iconfont') format('svg');
    }

### 第二步：定义使用 iconfont 的样式

    .iconfont {
      font-family: "iconfont" !important;
      font-size: 16px;
      font-style: normal;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }

### 第三步：挑选相应图标并获取字体编码，应用于页面

    <span class="iconfont">&#x33;</span>

> "iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

- favourites-filled-star-symbol
  .icon-favourites-filled-star-symbol
- 转发
  .icon-zhuanfa
- 小程序-联系我们icon
  .icon-xiaochengxu-lianxiwomenicon
- 小程序-参观登记icon
  .icon-xiaochengxu-canguandengjiicon
- 小程序-人气icon
  .icon-xiaochengxu-renqiicon
- 小程序-浮标管理icon
  .icon-xiaochengxu-fubiaoguanliicon
- 小程序-条款管理icon
  .icon-xiaochengxu-tiaokuanguanliicon
- 小程序-广告管理icon
  .icon-xiaochengxu-guanggaoguanliicon
- 小程序-弹窗管理icon
  .icon-xiaochengxu-danchuangguanliicon
- 小程序-投票icon
  .icon-xiaochengxu-toupiaoicon
- 小程序-观众预登记icon
  .icon-xiaochengxu-guanzhongyudengjiicon
- 小程序-个人中心icon
  .icon-xiaochengxu-gerenzhongxinicon
- 小程序-交通指南icon
  .icon-xiaochengxu-jiaotongzhinanicon
- 小程序-观众指南icon
  .icon-xiaochengxu-guanzhongzhinanicon
- 小程序-展馆平面图icon
  .icon-xiaochengxu-zhanguanpingmiantuicon
- 小程序-展商名录icon
  .icon-xiaochengxu-zhanshangmingluicon
- 小程序-关于展会icon
  .icon-xiaochengxu-guanyuzhanhuiicon
- 企业海报定制icon
  .icon-qiyehaibaodingzhiicon
- 下载中心icon
  .icon-xiazaizhongxinicon1
- 贵宾观众邀请icon
  .icon-guibinguanzhongyaoqingicon
- 胸卡申请icon
  .icon-xiongkashenqingicon
- 展台活动icon
  .icon-zhantaihuodongicon
- 展商新闻icon
  .icon-zhanshangxinwenicon
- 展品资料icon
  .icon-zhanpinziliaoicon
- 展商中心总览icon
  .icon-zhanshangzhongxinzonglanicon
- 展商信息icon
  .icon-zhanshangxinxiicon
- 新闻
  .icon-xinwen
- 消息
  .icon-xitongxiaoxishezhi
- right icon_画板 1
  .icon-right-s
- right icon_画板 1-copy-copy
  .icon-left-s
- right icon_画板 1-copy
  .icon-up-s
- right icon_画板 1-copy
  .icon-down-s
- wechat-fill
  .icon-wechat-fill
- 领英
  .icon-lingying
- Top 100
  .icon-a-Top100
- 企业库
  .icon-qiyeku
- 公司库
  .icon-gongsiku
- Record
  .icon-Record
- Registration
  .icon-Registration
- Pause-Circle
  .icon-Pause-Circle
- Bookmark
  .icon-Bookmark
- Bookmark-Filled
  .icon-Bookmark-Filled
- Sound
  .icon-Sound
- Map
  .icon-Map
- Route
  .icon-Route
- Print
  .icon-Print
- Transport
  .icon-Transport
- Edit
  .icon-Edit
- GeoLocation
  .icon-GeoLocation
- Share
  .icon-Share
- Search
  .icon-Search
- BookmarkCheck
  .icon-BookmarkCheck
- Archive
  .icon-Archive
- Play-Circle
  .icon-Play-Circle
- Vector
  .icon-Vector
- Placeholder-Icon
  .icon-Placeholder-Icon
- Favourites-Add-Alt-Large
  .icon-Favourites-Add-Alt-Large
- Favourites-Add-Large
  .icon-Favourites-Add-Large
- Mecial Mask
  .icon-a-MecialMask
- Exclamation-Circle-Large-1
  .icon-Exclamation-Circle-Large-1
- Checkmak-Circle-Large
  .icon-Checkmak-Circle-Large
- Exclamation-Circle-Large
  .icon-Exclamation-Circle-Large
- Calendar-No-Slots-Large
  .icon-Calendar-No-Slots-Large
- Calendar-Add-Large
  .icon-Calendar-Add-Large
- Rocket-Launch-Large
  .icon-Rocket-Launch-Large
- medium
  .icon-medium
- icon-kfckfc
  .icon-a-XehemalsTwitter
- Vimeo
  .icon-Vimeo
- Thumb Up
  .icon-a-ThumbUp
- Thumb Down
  .icon-a-ThumbDown
- Soundcloud
  .icon-Soundcloud
- Spotify
  .icon-Spotify
- Deezer
  .icon-Deezer
- icon-kfckfc
  .icon-Pinterest
- Xing
  .icon-Xing
- Apple-Podcast
  .icon-Apple-Podcast
- Podigee
  .icon-Podigee
- Instagram
  .icon-Instagram1
- Facebook
  .icon-Facebook1
- Registration 2
  .icon-a-Registration2
- Instagram
  .icon-Instagram
- Facebook
  .icon-Facebook
- YouTube-Block
  .icon-YouTube-Block
- YouTube
  .icon-YouTube
- Exhibitor
  .icon-Exhibitor
- Chairman
  .icon-Chairman
- AddContact
  .icon-AddContact
- Group
  .icon-Group
- DeleteContact
  .icon-DeleteContact
- Profile
  .icon-Profile
- Contacts
  .icon-Contacts
- Speaker
  .icon-Speaker
- User-Placeholder
  .icon-User-Placeholder
- CalendarCheck
  .icon-CalendarCheck1
- Mobility
  .icon-Mobility
- Car
  .icon-Car
- Plane
  .icon-Plane
- Train
  .icon-Train
- Bus
  .icon-Bus
- HourglassFull
  .icon-HourglassFull
- Clock
  .icon-Clock
- Calendar
  .icon-Calendar
- CalendarPending
  .icon-CalendarPending
- CalendarDelete
  .icon-CalendarDelete
- Date
  .icon-Date
- CalendarAdd
  .icon-CalendarAdd1
- CalendarAdd
  .icon-CalendarAdd
- Wait
  .icon-Wait
- Hourglass
  .icon-Hourglass
- CalendarCheck
  .icon-CalendarCheck
- Unlocked
  .icon-Unlocked
- Locked
  .icon-Locked
- Flag
  .icon-Flag
- Rocket
  .icon-Rocket
- Present
  .icon-Present
- Light
  .icon-Light
- World
  .icon-World
- Award
  .icon-Award
- Ticket
  .icon-Ticket
- Beverages
  .icon-Beverages
- Compass
  .icon-Compass
- Mountain
  .icon-Mountain
- Diamond
  .icon-Diamond
- Star-Filled
  .icon-Star-Filled
- Beer
  .icon-Beer
- Food
  .icon-Food
- Shopping
  .icon-Shopping
- Star
  .icon-Star
- megaphone
  .icon-megaphone
- Heart
  .icon-Heart
- FilterHoriz
  .icon-FilterHoriz
- Exit
  .icon-Exit
- Left-1
  .icon-Left-1
- Center
  .icon-Center
- Down
  .icon-Down
- FullscreenExit
  .icon-FullscreenExit
- Filter
  .icon-Filter
- DownSmall
  .icon-DownSmall
- FullscreenEnter
  .icon-FullscreenEnter
- LeftSmall
  .icon-LeftSmall
- Grid
  .icon-Grid
- Left
  .icon-Left
- PointMenu
  .icon-PointMenu
- PictureInPicture
  .icon-PictureInPicture
- BackToSource-1
  .icon-BackToSource-1
- Cancel-copy
  .icon-Cancel-copy
- DotMenu
  .icon-DotMenu
- BurgerMenu
  .icon-BurgerMenu
- Cancel
  .icon-Cancel
- DotMenuHoriz
  .icon-DotMenuHoriz
- ArrowRight
  .icon-ArrowRight
- ArrowLeft
  .icon-ArrowLeft
- BackToSource
  .icon-BackToSource
- ArrowUp
  .icon-ArrowUp
- BackToSource-copy
  .icon-BackToSource-copy
- ArrowDown
  .icon-ArrowDown
- Apps
  .icon-Apps
- MailOpen
  .icon-MailOpen
- Desktop
  .icon-Desktop
- Workshop
  .icon-Workshop
- Presentation
  .icon-Presentation
- Percent
  .icon-Percent
- Cards
  .icon-Cards1
- Card
  .icon-Card
- Notification
  .icon-Notification
- Icon (source)
  .icon-a-Iconsource
- Apple
  .icon-Apple
- Office365
  .icon-Office365
- Google-Calendar
  .icon-Google-Calendar
- ICS
  .icon-ICS
- Location=Placeholder
  .icon-a-LocationPlaceholder
- icon-kfckfc
  .icon-a-101_twitter
- icon-kfckfc
  .icon-a-92_twitter
- Size=180
  .icon-a-Size180
- Graph2
  .icon-Graph2
- Graph
  .icon-Graph
- Hybrid
  .icon-Hybrid
- Chatbot
  .icon-Chatbot
- Mail
  .icon-Mail
- Inbox
  .icon-Inbox
- Fax
  .icon-Fax
- Live
  .icon-Live
- VIP
  .icon-VIP
- Briefcase
  .icon-Briefcase
- Alert
  .icon-Alert
- Y-Axis
  .icon-Y-Axis
- NotificationsOff
  .icon-NotificationsOff
- Bill
  .icon-Bill
- VideoDisabled
  .icon-VideoDisabled
- Yahoo
  .icon-Yahoo
- Stop
  .icon-Stop
- Error
  .icon-Error
- Match
  .icon-Match
- Partners
  .icon-Partners
- Fee
  .icon-Fee
- Graph3
  .icon-Graph3
- Message
  .icon-Message1
- MailSent
  .icon-MailSent
- Smartphone
  .icon-Smartphone
- Phone
  .icon-Phone
- Senden
  .icon-Senden
- Message-Filled
  .icon-Message-Filled
- CheckCircle-Filled
  .icon-CheckCircle-Filled
- Check
  .icon-Check
- Attachment
  .icon-Attachment
- Folder
  .icon-Folder
- Filled
  .icon-Filled
- Blank
  .icon-Blank
- Circle
  .icon-Circle
- Info
  .icon-Info
- DownloadCompletet
  .icon-DownloadCompletet
- Download
  .icon-Download
- Delete
  .icon-Delete
- Copy
  .icon-Copy
- CheckCircle
  .icon-CheckCircle
- Translate
  .icon-Translate
- Volume-Mute
  .icon-Volume-Mute
- Volume-Low
  .icon-Volume-Low
- Typing
  .icon-Typing
- Volume
  .icon-Volume
- View
  .icon-View
- Video
  .icon-Video
- Table
  .icon-Table
- Building1
  .icon-Building1
- Target
  .icon-Target
- MapCluster
  .icon-MapCluster
- Home
  .icon-Home
- Factory
  .icon-Factory
- Building2
  .icon-Building2
- Booth
  .icon-Booth
- Upload
  .icon-Upload
- Settings
  .icon-Settings
- Shuffle
  .icon-Shuffle
- Spinner
  .icon-Spinner
- Reload
  .icon-Reload
- Replay
  .icon-Replay
- Link-Broken
  .icon-Link-Broken
- Picture
  .icon-Picture
- Plus
  .icon-Plus
- Photo
  .icon-Photo
- Play
  .icon-Play
- Pause
  .icon-Pause
- Link
  .icon-Link
- Minus
  .icon-Minus
- oe-a
  .icon-oe-a

## font-class 引用

font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。

与 Unicode 使用方式相比，具有如下特点：

- 相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。
- 因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。

使用步骤如下：

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

    <link rel="stylesheet" href="./iconfont.css">

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

    <span class="iconfont icon-xxx"></span>

> " iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

- favourites-filled-star-symbol
  #icon-favourites-filled-star-symbol
- 转发
  #icon-zhuanfa
- 小程序-联系我们icon
  #icon-xiaochengxu-lianxiwomenicon
- 小程序-参观登记icon
  #icon-xiaochengxu-canguandengjiicon
- 小程序-人气icon
  #icon-xiaochengxu-renqiicon
- 小程序-浮标管理icon
  #icon-xiaochengxu-fubiaoguanliicon
- 小程序-条款管理icon
  #icon-xiaochengxu-tiaokuanguanliicon
- 小程序-广告管理icon
  #icon-xiaochengxu-guanggaoguanliicon
- 小程序-弹窗管理icon
  #icon-xiaochengxu-danchuangguanliicon
- 小程序-投票icon
  #icon-xiaochengxu-toupiaoicon
- 小程序-观众预登记icon
  #icon-xiaochengxu-guanzhongyudengjiicon
- 小程序-个人中心icon
  #icon-xiaochengxu-gerenzhongxinicon
- 小程序-交通指南icon
  #icon-xiaochengxu-jiaotongzhinanicon
- 小程序-观众指南icon
  #icon-xiaochengxu-guanzhongzhinanicon
- 小程序-展馆平面图icon
  #icon-xiaochengxu-zhanguanpingmiantuicon
- 小程序-展商名录icon
  #icon-xiaochengxu-zhanshangmingluicon
- 小程序-关于展会icon
  #icon-xiaochengxu-guanyuzhanhuiicon
- 企业海报定制icon
  #icon-qiyehaibaodingzhiicon
- 下载中心icon
  #icon-xiazaizhongxinicon1
- 贵宾观众邀请icon
  #icon-guibinguanzhongyaoqingicon
- 胸卡申请icon
  #icon-xiongkashenqingicon
- 展台活动icon
  #icon-zhantaihuodongicon
- 展商新闻icon
  #icon-zhanshangxinwenicon
- 展品资料icon
  #icon-zhanpinziliaoicon
- 展商中心总览icon
  #icon-zhanshangzhongxinzonglanicon
- 展商信息icon
  #icon-zhanshangxinxiicon
- 新闻
  #icon-xinwen
- 消息
  #icon-xitongxiaoxishezhi
- right icon_画板 1
  #icon-right-s
- right icon_画板 1-copy-copy
  #icon-left-s
- right icon_画板 1-copy
  #icon-up-s
- right icon_画板 1-copy
  #icon-down-s
- wechat-fill
  #icon-wechat-fill
- 领英
  #icon-lingying
- Top 100
  #icon-a-Top100
- 企业库
  #icon-qiyeku
- 公司库
  #icon-gongsiku
- Record
  #icon-Record
- Registration
  #icon-Registration
- Pause-Circle
  #icon-Pause-Circle
- Bookmark
  #icon-Bookmark
- Bookmark-Filled
  #icon-Bookmark-Filled
- Sound
  #icon-Sound
- Map
  #icon-Map
- Route
  #icon-Route
- Print
  #icon-Print
- Transport
  #icon-Transport
- Edit
  #icon-Edit
- GeoLocation
  #icon-GeoLocation
- Share
  #icon-Share
- Search
  #icon-Search
- BookmarkCheck
  #icon-BookmarkCheck
- Archive
  #icon-Archive
- Play-Circle
  #icon-Play-Circle
- Vector
  #icon-Vector
- Placeholder-Icon
  #icon-Placeholder-Icon
- Favourites-Add-Alt-Large
  #icon-Favourites-Add-Alt-Large
- Favourites-Add-Large
  #icon-Favourites-Add-Large
- Mecial Mask
  #icon-a-MecialMask
- Exclamation-Circle-Large-1
  #icon-Exclamation-Circle-Large-1
- Checkmak-Circle-Large
  #icon-Checkmak-Circle-Large
- Exclamation-Circle-Large
  #icon-Exclamation-Circle-Large
- Calendar-No-Slots-Large
  #icon-Calendar-No-Slots-Large
- Calendar-Add-Large
  #icon-Calendar-Add-Large
- Rocket-Launch-Large
  #icon-Rocket-Launch-Large
- medium
  #icon-medium
- icon-kfckfc
  #icon-a-XehemalsTwitter
- Vimeo
  #icon-Vimeo
- Thumb Up
  #icon-a-ThumbUp
- Thumb Down
  #icon-a-ThumbDown
- Soundcloud
  #icon-Soundcloud
- Spotify
  #icon-Spotify
- Deezer
  #icon-Deezer
- icon-kfckfc
  #icon-Pinterest
- Xing
  #icon-Xing
- Apple-Podcast
  #icon-Apple-Podcast
- Podigee
  #icon-Podigee
- Instagram
  #icon-Instagram1
- Facebook
  #icon-Facebook1
- Registration 2
  #icon-a-Registration2
- Instagram
  #icon-Instagram
- Facebook
  #icon-Facebook
- YouTube-Block
  #icon-YouTube-Block
- YouTube
  #icon-YouTube
- Exhibitor
  #icon-Exhibitor
- Chairman
  #icon-Chairman
- AddContact
  #icon-AddContact
- Group
  #icon-Group
- DeleteContact
  #icon-DeleteContact
- Profile
  #icon-Profile
- Contacts
  #icon-Contacts
- Speaker
  #icon-Speaker
- User-Placeholder
  #icon-User-Placeholder
- CalendarCheck
  #icon-CalendarCheck1
- Mobility
  #icon-Mobility
- Car
  #icon-Car
- Plane
  #icon-Plane
- Train
  #icon-Train
- Bus
  #icon-Bus
- HourglassFull
  #icon-HourglassFull
- Clock
  #icon-Clock
- Calendar
  #icon-Calendar
- CalendarPending
  #icon-CalendarPending
- CalendarDelete
  #icon-CalendarDelete
- Date
  #icon-Date
- CalendarAdd
  #icon-CalendarAdd1
- CalendarAdd
  #icon-CalendarAdd
- Wait
  #icon-Wait
- Hourglass
  #icon-Hourglass
- CalendarCheck
  #icon-CalendarCheck
- Unlocked
  #icon-Unlocked
- Locked
  #icon-Locked
- Flag
  #icon-Flag
- Rocket
  #icon-Rocket
- Present
  #icon-Present
- Light
  #icon-Light
- World
  #icon-World
- Award
  #icon-Award
- Ticket
  #icon-Ticket
- Beverages
  #icon-Beverages
- Compass
  #icon-Compass
- Mountain
  #icon-Mountain
- Diamond
  #icon-Diamond
- Star-Filled
  #icon-Star-Filled
- Beer
  #icon-Beer
- Food
  #icon-Food
- Shopping
  #icon-Shopping
- Star
  #icon-Star
- megaphone
  #icon-megaphone
- Heart
  #icon-Heart
- FilterHoriz
  #icon-FilterHoriz
- Exit
  #icon-Exit
- Left-1
  #icon-Left-1
- Center
  #icon-Center
- Down
  #icon-Down
- FullscreenExit
  #icon-FullscreenExit
- Filter
  #icon-Filter
- DownSmall
  #icon-DownSmall
- FullscreenEnter
  #icon-FullscreenEnter
- LeftSmall
  #icon-LeftSmall
- Grid
  #icon-Grid
- Left
  #icon-Left
- PointMenu
  #icon-PointMenu
- PictureInPicture
  #icon-PictureInPicture
- BackToSource-1
  #icon-BackToSource-1
- Cancel-copy
  #icon-Cancel-copy
- DotMenu
  #icon-DotMenu
- BurgerMenu
  #icon-BurgerMenu
- Cancel
  #icon-Cancel
- DotMenuHoriz
  #icon-DotMenuHoriz
- ArrowRight
  #icon-ArrowRight
- ArrowLeft
  #icon-ArrowLeft
- BackToSource
  #icon-BackToSource
- ArrowUp
  #icon-ArrowUp
- BackToSource-copy
  #icon-BackToSource-copy
- ArrowDown
  #icon-ArrowDown
- Apps
  #icon-Apps
- MailOpen
  #icon-MailOpen
- Desktop
  #icon-Desktop
- Workshop
  #icon-Workshop
- Presentation
  #icon-Presentation
- Percent
  #icon-Percent
- Cards
  #icon-Cards1
- Card
  #icon-Card
- Notification
  #icon-Notification
- Icon (source)
  #icon-a-Iconsource
- Apple
  #icon-Apple
- Office365
  #icon-Office365
- Google-Calendar
  #icon-Google-Calendar
- ICS
  #icon-ICS
- Location=Placeholder
  #icon-a-LocationPlaceholder
- icon-kfckfc
  #icon-a-101_twitter
- icon-kfckfc
  #icon-a-92_twitter
- Size=180
  #icon-a-Size180
- Graph2
  #icon-Graph2
- Graph
  #icon-Graph
- Hybrid
  #icon-Hybrid
- Chatbot
  #icon-Chatbot
- Mail
  #icon-Mail
- Inbox
  #icon-Inbox
- Fax
  #icon-Fax
- Live
  #icon-Live
- VIP
  #icon-VIP
- Briefcase
  #icon-Briefcase
- Alert
  #icon-Alert
- Y-Axis
  #icon-Y-Axis
- NotificationsOff
  #icon-NotificationsOff
- Bill
  #icon-Bill
- VideoDisabled
  #icon-VideoDisabled
- Yahoo
  #icon-Yahoo
- Stop
  #icon-Stop
- Error
  #icon-Error
- Match
  #icon-Match
- Partners
  #icon-Partners
- Fee
  #icon-Fee
- Graph3
  #icon-Graph3
- Message
  #icon-Message1
- MailSent
  #icon-MailSent
- Smartphone
  #icon-Smartphone
- Phone
  #icon-Phone
- Senden
  #icon-Senden
- Message-Filled
  #icon-Message-Filled
- CheckCircle-Filled
  #icon-CheckCircle-Filled
- Check
  #icon-Check
- Attachment
  #icon-Attachment
- Folder
  #icon-Folder
- Filled
  #icon-Filled
- Blank
  #icon-Blank
- Circle
  #icon-Circle
- Info
  #icon-Info
- DownloadCompletet
  #icon-DownloadCompletet
- Download
  #icon-Download
- Delete
  #icon-Delete
- Copy
  #icon-Copy
- CheckCircle
  #icon-CheckCircle
- Translate
  #icon-Translate
- Volume-Mute
  #icon-Volume-Mute
- Volume-Low
  #icon-Volume-Low
- Typing
  #icon-Typing
- Volume
  #icon-Volume
- View
  #icon-View
- Video
  #icon-Video
- Table
  #icon-Table
- Building1
  #icon-Building1
- Target
  #icon-Target
- MapCluster
  #icon-MapCluster
- Home
  #icon-Home
- Factory
  #icon-Factory
- Building2
  #icon-Building2
- Booth
  #icon-Booth
- Upload
  #icon-Upload
- Settings
  #icon-Settings
- Shuffle
  #icon-Shuffle
- Spinner
  #icon-Spinner
- Reload
  #icon-Reload
- Replay
  #icon-Replay
- Link-Broken
  #icon-Link-Broken
- Picture
  #icon-Picture
- Plus
  #icon-Plus
- Photo
  #icon-Photo
- Play
  #icon-Play
- Pause
  #icon-Pause
- Link
  #icon-Link
- Minus
  #icon-Minus
- oe-a
  #icon-oe-a

## Symbol 引用

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

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

使用步骤如下：

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

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

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

    <style>
    .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>