h_ui
Version:
A Vue.js 2.0 UI Components Framework
6,064 lines • 253 kB
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>IconFont</title>
<link rel="stylesheet" href="demo.css">
<script src="iconfont.js"></script>
<style type="text/css">
.icon {
/* 通过设置 font-size 来改变图标大小 */
width: 1em; height: 1em;
/* 图标和文字相邻时，垂直对齐 */
vertical-align: -0.15em;
/* 通过设置 color 来改变 SVG 的颜色/fill */
fill: currentColor;
/* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
normalize.css 中也包含这行 */
overflow: hidden;
}
</style>
</head>
<body>
<div class="main markdown">
<h1>IconFont 图标</h1>
<ul class="icon_lists clear">
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-person-stalker"></use>
</svg>
<div class="name">person-stalker</div>
<div class="fontclass">#icon-person-stalker</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-card"></use>
</svg>
<div class="name">card</div>
<div class="fontclass">#icon-card</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-code"></use>
</svg>
<div class="name">code</div>
<div class="fontclass">#icon-code</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-eye-disabled"></use>
</svg>
<div class="name">eye-disabled</div>
<div class="fontclass">#icon-eye-disabled</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-chatbubble-working"></use>
</svg>
<div class="name">chatbubble-working</div>
<div class="fontclass">#icon-chatbubble-working</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-image"></use>
</svg>
<div class="name">image</div>
<div class="fontclass">#icon-image</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-contacts"></use>
</svg>
<div class="name">android-contacts</div>
<div class="fontclass">#icon-android-contacts</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-sunny"></use>
</svg>
<div class="name">android-sunny</div>
<div class="fontclass">#icon-android-sunny</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-textsms"></use>
</svg>
<div class="name">android-textsms</div>
<div class="fontclass">#icon-android-textsms</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-alert"></use>
</svg>
<div class="name">android-alert</div>
<div class="fontclass">#icon-android-alert</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-bar"></use>
</svg>
<div class="name">android-bar</div>
<div class="fontclass">#icon-android-bar</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-bulb"></use>
</svg>
<div class="name">android-bulb</div>
<div class="fontclass">#icon-android-bulb</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-camera"></use>
</svg>
<div class="name">android-camera</div>
<div class="fontclass">#icon-android-camera</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-cart"></use>
</svg>
<div class="name">android-cart</div>
<div class="fontclass">#icon-android-cart</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-cloud-outline"></use>
</svg>
<div class="name">android-cloud-outline</div>
<div class="fontclass">#icon-android-cloud-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-document"></use>
</svg>
<div class="name">android-document</div>
<div class="fontclass">#icon-android-document</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-done"></use>
</svg>
<div class="name">android-done</div>
<div class="fontclass">#icon-android-done</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-done-all"></use>
</svg>
<div class="name">android-done-all</div>
<div class="fontclass">#icon-android-done-all</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-happy"></use>
</svg>
<div class="name">android-happy</div>
<div class="fontclass">#icon-android-happy</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-image"></use>
</svg>
<div class="name">android-image</div>
<div class="fontclass">#icon-android-image</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-notifications-none"></use>
</svg>
<div class="name">android-notifications-none</div>
<div class="fontclass">#icon-android-notifications-none</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-list"></use>
</svg>
<div class="name">android-list</div>
<div class="fontclass">#icon-android-list</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-plane"></use>
</svg>
<div class="name">android-plane</div>
<div class="fontclass">#icon-android-plane</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-playstore"></use>
</svg>
<div class="name">android-playstore</div>
<div class="fontclass">#icon-android-playstore</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-print"></use>
</svg>
<div class="name">android-print</div>
<div class="fontclass">#icon-android-print</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-sad"></use>
</svg>
<div class="name">android-sad</div>
<div class="fontclass">#icon-android-sad</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-star"></use>
</svg>
<div class="name">android-star</div>
<div class="fontclass">#icon-android-star</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-warning"></use>
</svg>
<div class="name">android-warning</div>
<div class="fontclass">#icon-android-warning</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-chatbubble"></use>
</svg>
<div class="name">chatbubble</div>
<div class="fontclass">#icon-chatbubble</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-headphone"></use>
</svg>
<div class="name">headphone</div>
<div class="fontclass">#icon-headphone</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-pinpoint"></use>
</svg>
<div class="name">pinpoint</div>
<div class="fontclass">#icon-pinpoint</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-qr-scanner"></use>
</svg>
<div class="name">qr-scanner</div>
<div class="fontclass">#icon-qr-scanner</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-skip-backward"></use>
</svg>
<div class="name">skip-backward</div>
<div class="fontclass">#icon-skip-backward</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-speedometer"></use>
</svg>
<div class="name">speedometer</div>
<div class="fontclass">#icon-speedometer</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-tshirt-outline"></use>
</svg>
<div class="name">tshirt-outline</div>
<div class="fontclass">#icon-tshirt-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-wineglass"></use>
</svg>
<div class="name">wineglass</div>
<div class="fontclass">#icon-wineglass</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-android"></use>
</svg>
<div class="name">social-android</div>
<div class="fontclass">#icon-social-android</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-android-outline"></use>
</svg>
<div class="name">social-android-outline</div>
<div class="fontclass">#icon-social-android-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-angular"></use>
</svg>
<div class="name">social-angular</div>
<div class="fontclass">#icon-social-angular</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-angular-outline"></use>
</svg>
<div class="name">social-angular-outline</div>
<div class="fontclass">#icon-social-angular-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-apple"></use>
</svg>
<div class="name">social-apple</div>
<div class="fontclass">#icon-social-apple</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-apple-outline"></use>
</svg>
<div class="name">social-apple-outline</div>
<div class="fontclass">#icon-social-apple-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-buffer"></use>
</svg>
<div class="name">social-buffer</div>
<div class="fontclass">#icon-social-buffer</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-buffer-outline"></use>
</svg>
<div class="name">social-buffer-outline</div>
<div class="fontclass">#icon-social-buffer-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-chrome"></use>
</svg>
<div class="name">social-chrome</div>
<div class="fontclass">#icon-social-chrome</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-chrome-outline"></use>
</svg>
<div class="name">social-chrome-outline</div>
<div class="fontclass">#icon-social-chrome-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-css3"></use>
</svg>
<div class="name">social-css3</div>
<div class="fontclass">#icon-social-css3</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-css3-outline"></use>
</svg>
<div class="name">social-css3-outline</div>
<div class="fontclass">#icon-social-css3-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-dribbble"></use>
</svg>
<div class="name">social-dribbble</div>
<div class="fontclass">#icon-social-dribbble</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-dribbble-outline"></use>
</svg>
<div class="name">social-dribbble-outline</div>
<div class="fontclass">#icon-social-dribbble-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-dropbox"></use>
</svg>
<div class="name">social-dropbox</div>
<div class="fontclass">#icon-social-dropbox</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-dropbox-outline"></use>
</svg>
<div class="name">social-dropbox-outline</div>
<div class="fontclass">#icon-social-dropbox-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-facebook"></use>
</svg>
<div class="name">social-facebook</div>
<div class="fontclass">#icon-social-facebook</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-facebook-outline"></use>
</svg>
<div class="name">social-facebook-outline</div>
<div class="fontclass">#icon-social-facebook-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-google-outline"></use>
</svg>
<div class="name">social-google-outline</div>
<div class="fontclass">#icon-social-google-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-html5"></use>
</svg>
<div class="name">social-html5</div>
<div class="fontclass">#icon-social-html5</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-html5-outline"></use>
</svg>
<div class="name">social-html5-outline</div>
<div class="fontclass">#icon-social-html5-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-instagram"></use>
</svg>
<div class="name">social-instagram</div>
<div class="fontclass">#icon-social-instagram</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-instagram-outline"></use>
</svg>
<div class="name">social-instagram-outline</div>
<div class="fontclass">#icon-social-instagram-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-javascript"></use>
</svg>
<div class="name">social-javascript</div>
<div class="fontclass">#icon-social-javascript</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-javascript-outline"></use>
</svg>
<div class="name">social-javascript-outline</div>
<div class="fontclass">#icon-social-javascript-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-linkedin"></use>
</svg>
<div class="name">social-linkedin</div>
<div class="fontclass">#icon-social-linkedin</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-linkedin-outline"></use>
</svg>
<div class="name">social-linkedin-outline</div>
<div class="fontclass">#icon-social-linkedin-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-markdown"></use>
</svg>
<div class="name">social-markdown</div>
<div class="fontclass">#icon-social-markdown</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-nodejs"></use>
</svg>
<div class="name">social-nodejs</div>
<div class="fontclass">#icon-social-nodejs</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-pinterest"></use>
</svg>
<div class="name">social-pinterest</div>
<div class="fontclass">#icon-social-pinterest</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-rss"></use>
</svg>
<div class="name">social-rss</div>
<div class="fontclass">#icon-social-rss</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-rss-outline"></use>
</svg>
<div class="name">social-rss-outline</div>
<div class="fontclass">#icon-social-rss-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-skype"></use>
</svg>
<div class="name">social-skype</div>
<div class="fontclass">#icon-social-skype</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-skype-outline"></use>
</svg>
<div class="name">social-skype-outline</div>
<div class="fontclass">#icon-social-skype-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-twitter"></use>
</svg>
<div class="name">social-twitter</div>
<div class="fontclass">#icon-social-twitter</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-twitter-outline"></use>
</svg>
<div class="name">social-twitter-outline</div>
<div class="fontclass">#icon-social-twitter-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-usd"></use>
</svg>
<div class="name">social-usd</div>
<div class="fontclass">#icon-social-usd</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-usd-outline"></use>
</svg>
<div class="name">social-usd-outline</div>
<div class="fontclass">#icon-social-usd-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-vimeo"></use>
</svg>
<div class="name">social-vimeo</div>
<div class="fontclass">#icon-social-vimeo</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-vimeo-outline"></use>
</svg>
<div class="name">social-vimeo-outline</div>
<div class="fontclass">#icon-social-vimeo-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-whatsapp"></use>
</svg>
<div class="name">social-whatsapp</div>
<div class="fontclass">#icon-social-whatsapp</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-whatsapp-outline"></use>
</svg>
<div class="name">social-whatsapp-outline</div>
<div class="fontclass">#icon-social-whatsapp-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-windows"></use>
</svg>
<div class="name">social-windows</div>
<div class="fontclass">#icon-social-windows</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-windows-outline"></use>
</svg>
<div class="name">social-windows-outline</div>
<div class="fontclass">#icon-social-windows-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-wordpress"></use>
</svg>
<div class="name">social-wordpress</div>
<div class="fontclass">#icon-social-wordpress</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-wordpress-outline"></use>
</svg>
<div class="name">social-wordpress-outline</div>
<div class="fontclass">#icon-social-wordpress-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-yen"></use>
</svg>
<div class="name">social-yen</div>
<div class="fontclass">#icon-social-yen</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-yen-outline"></use>
</svg>
<div class="name">social-yen-outline</div>
<div class="fontclass">#icon-social-yen-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-youtube"></use>
</svg>
<div class="name">social-youtube</div>
<div class="fontclass">#icon-social-youtube</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-youtube-outline"></use>
</svg>
<div class="name">social-youtube-outline</div>
<div class="fontclass">#icon-social-youtube-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-download"></use>
</svg>
<div class="name">android-download</div>
<div class="fontclass">#icon-android-download</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-coffee"></use>
</svg>
<div class="name">coffee</div>
<div class="fontclass">#icon-coffee</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-bell"></use>
</svg>
<div class="name">ios-bell</div>
<div class="fontclass">#icon-ios-bell</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-home"></use>
</svg>
<div class="name">ios-home</div>
<div class="fontclass">#icon-ios-home</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-lightbulb"></use>
</svg>
<div class="name">ios-lightbulb</div>
<div class="fontclass">#icon-ios-lightbulb</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ribbon-b"></use>
</svg>
<div class="name">ribbon-b</div>
<div class="fontclass">#icon-ribbon-b</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-close"></use>
</svg>
<div class="name">android-close</div>
<div class="fontclass">#icon-android-close</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-arrow-back"></use>
</svg>
<div class="name">android-arrow-back</div>
<div class="fontclass">#icon-android-arrow-back</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-exit"></use>
</svg>
<div class="name">android-exit</div>
<div class="fontclass">#icon-android-exit</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-battery-charging"></use>
</svg>
<div class="name">battery-charging</div>
<div class="fontclass">#icon-battery-charging</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-lock"></use>
</svg>
<div class="name">android-lock</div>
<div class="fontclass">#icon-android-lock</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-chat"></use>
</svg>
<div class="name">android-chat</div>
<div class="fontclass">#icon-android-chat</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-checkbox-outline-blank"></use>
</svg>
<div class="name">android-checkbox-outline-blank</div>
<div class="fontclass">#icon-android-checkbox-outline-blank</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-navigate"></use>
</svg>
<div class="name">android-navigate</div>
<div class="fontclass">#icon-android-navigate</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-restaurant"></use>
</svg>
<div class="name">android-restaurant</div>
<div class="fontclass">#icon-android-restaurant</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-star-outline"></use>
</svg>
<div class="name">android-star-outline</div>
<div class="fontclass">#icon-android-star-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-sync"></use>
</svg>
<div class="name">android-sync</div>
<div class="fontclass">#icon-android-sync</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-volume-down"></use>
</svg>
<div class="name">android-volume-down</div>
<div class="fontclass">#icon-android-volume-down</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-laptop"></use>
</svg>
<div class="name">laptop</div>
<div class="fontclass">#icon-laptop</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-mic-c"></use>
</svg>
<div class="name">mic-c</div>
<div class="fontclass">#icon-mic-c</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-person-add"></use>
</svg>
<div class="name">person-add</div>
<div class="fontclass">#icon-person-add</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-pricetags"></use>
</svg>
<div class="name">pricetags</div>
<div class="fontclass">#icon-pricetags</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-printer"></use>
</svg>
<div class="name">printer</div>
<div class="fontclass">#icon-printer</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-yahoo"></use>
</svg>
<div class="name">social-yahoo</div>
<div class="fontclass">#icon-social-yahoo</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-thumbsdown"></use>
</svg>
<div class="name">thumbsdown</div>
<div class="fontclass">#icon-thumbsdown</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-desktop"></use>
</svg>
<div class="name">android-desktop</div>
<div class="fontclass">#icon-android-desktop</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-film"></use>
</svg>
<div class="name">android-film</div>
<div class="fontclass">#icon-android-film</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-globe"></use>
</svg>
<div class="name">android-globe</div>
<div class="fontclass">#icon-android-globe</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-mail"></use>
</svg>
<div class="name">android-mail</div>
<div class="fontclass">#icon-android-mail</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-open"></use>
</svg>
<div class="name">android-open</div>
<div class="fontclass">#icon-android-open</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-options"></use>
</svg>
<div class="name">android-options</div>
<div class="fontclass">#icon-android-options</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-person-add"></use>
</svg>
<div class="name">android-person-add</div>
<div class="fontclass">#icon-android-person-add</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-phone-landscape"></use>
</svg>
<div class="name">android-phone-landscape</div>
<div class="fontclass">#icon-android-phone-landscape</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-compass"></use>
</svg>
<div class="name">compass</div>
<div class="fontclass">#icon-compass</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-flash"></use>
</svg>
<div class="name">flash</div>
<div class="fontclass">#icon-flash</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-merge"></use>
</svg>
<div class="name">merge</div>
<div class="fontclass">#icon-merge</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-mouse"></use>
</svg>
<div class="name">mouse</div>
<div class="fontclass">#icon-mouse</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-codepen"></use>
</svg>
<div class="name">social-codepen</div>
<div class="fontclass">#icon-social-codepen</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-googleplus"></use>
</svg>
<div class="name">social-googleplus</div>
<div class="fontclass">#icon-social-googleplus</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-unlocked"></use>
</svg>
<div class="name">unlocked</div>
<div class="fontclass">#icon-unlocked</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-videocamera"></use>
</svg>
<div class="name">videocamera</div>
<div class="fontclass">#icon-videocamera</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-man"></use>
</svg>
<div class="name">man</div>
<div class="fontclass">#icon-man</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-bug"></use>
</svg>
<div class="name">bug</div>
<div class="fontclass">#icon-bug</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-arrow-down"></use>
</svg>
<div class="name">android-arrow-down</div>
<div class="fontclass">#icon-android-arrow-down</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-iphone"></use>
</svg>
<div class="name">iphone</div>
<div class="fontclass">#icon-iphone</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-checkbox"></use>
</svg>
<div class="name">android-checkbox</div>
<div class="fontclass">#icon-android-checkbox</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-create"></use>
</svg>
<div class="name">android-create</div>
<div class="fontclass">#icon-android-create</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-delete"></use>
</svg>
<div class="name">android-delete</div>
<div class="fontclass">#icon-android-delete</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-expand"></use>
</svg>
<div class="name">android-expand</div>
<div class="fontclass">#icon-android-expand</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-favorite-outline"></use>
</svg>
<div class="name">android-favorite-outline</div>
<div class="fontclass">#icon-android-favorite-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-locate"></use>
</svg>
<div class="name">android-locate</div>
<div class="fontclass">#icon-android-locate</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-more-vertical"></use>
</svg>
<div class="name">android-more-vertical</div>
<div class="fontclass">#icon-android-more-vertical</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-people"></use>
</svg>
<div class="name">android-people</div>
<div class="fontclass">#icon-android-people</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-send"></use>
</svg>
<div class="name">android-send</div>
<div class="fontclass">#icon-android-send</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-share"></use>
</svg>
<div class="name">android-share</div>
<div class="fontclass">#icon-android-share</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-watch"></use>
</svg>
<div class="name">android-watch</div>
<div class="fontclass">#icon-android-watch</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-at"></use>
</svg>
<div class="name">at</div>
<div class="fontclass">#icon-at</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-bag"></use>
</svg>
<div class="name">bag</div>
<div class="fontclass">#icon-bag</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-battery-empty"></use>
</svg>
<div class="name">battery-empty</div>
<div class="fontclass">#icon-battery-empty</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-battery-low"></use>
</svg>
<div class="name">battery-low</div>
<div class="fontclass">#icon-battery-low</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-beer"></use>
</svg>
<div class="name">beer</div>
<div class="fontclass">#icon-beer</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-bowtie"></use>
</svg>
<div class="name">bowtie</div>
<div class="fontclass">#icon-bowtie</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-cash"></use>
</svg>
<div class="name">cash</div>
<div class="fontclass">#icon-cash</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-code-working"></use>
</svg>
<div class="name">code-working</div>
<div class="fontclass">#icon-code-working</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-connection-bars"></use>
</svg>
<div class="name">connection-bars</div>
<div class="fontclass">#icon-connection-bars</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-cube"></use>
</svg>
<div class="name">cube</div>
<div class="fontclass">#icon-cube</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-eject"></use>
</svg>
<div class="name">eject</div>
<div class="fontclass">#icon-eject</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-flash-off"></use>
</svg>
<div class="name">flash-off</div>
<div class="fontclass">#icon-flash-off</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-grid"></use>
</svg>
<div class="name">grid</div>
<div class="fontclass">#icon-grid</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-leaf"></use>
</svg>
<div class="name">leaf</div>
<div class="fontclass">#icon-leaf</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-load-c"></use>
</svg>
<div class="name">load-c</div>
<div class="fontclass">#icon-load-c</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-nuclear"></use>
</svg>
<div class="name">nuclear</div>
<div class="fontclass">#icon-nuclear</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-person"></use>
</svg>
<div class="name">person</div>
<div class="fontclass">#icon-person</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-googleplus-outline"></use>
</svg>
<div class="name">social-googleplus-outline</div>
<div class="fontclass">#icon-social-googleplus-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-twitch"></use>
</svg>
<div class="name">social-twitch</div>
<div class="fontclass">#icon-social-twitch</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-speakerphone"></use>
</svg>
<div class="name">speakerphone</div>
<div class="fontclass">#icon-speakerphone</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-thumbsup"></use>
</svg>
<div class="name">thumbsup</div>
<div class="fontclass">#icon-thumbsup</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-volume-high"></use>
</svg>
<div class="name">volume-high</div>
<div class="fontclass">#icon-volume-high</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-wifi"></use>
</svg>
<div class="name">wifi</div>
<div class="fontclass">#icon-wifi</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-tuichu"></use>
</svg>
<div class="name">quit</div>
<div class="fontclass">#icon-tuichu</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-github"></use>
</svg>
<div class="name">social-github</div>
<div class="fontclass">#icon-social-github</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-playstation"></use>
</svg>
<div class="name">playstation</div>
<div class="fontclass">#icon-playstation</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-albums"></use>
</svg>
<div class="name">ios-albums</div>
<div class="fontclass">#icon-ios-albums</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-baseball-outline"></use>
</svg>
<div class="name">ios-baseball-outline</div>
<div class="fontclass">#icon-ios-baseball-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-stop"></use>
</svg>
<div class="name">stop</div>
<div class="fontclass">#icon-stop</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-add"></use>
</svg>
<div class="name">android-add</div>
<div class="fontclass">#icon-android-add</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-bus"></use>
</svg>
<div class="name">android-bus</div>
<div class="fontclass">#icon-android-bus</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-cancel"></use>
</svg>
<div class="name">android-cancel</div>
<div class="fontclass">#icon-android-cancel</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-checkbox-outline"></use>
</svg>
<div class="name">android-checkbox-outline</div>
<div class="fontclass">#icon-android-checkbox-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-contact"></use>
</svg>
<div class="name">android-contact</div>
<div class="fontclass">#icon-android-contact</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-contract"></use>
</svg>
<div class="name">android-contract</div>
<div class="fontclass">#icon-android-contract</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-folder"></use>
</svg>
<div class="name">android-folder</div>
<div class="fontclass">#icon-android-folder</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-laptop"></use>
</svg>
<div class="name">android-laptop</div>
<div class="fontclass">#icon-android-laptop</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-menu"></use>
</svg>
<div class="name">android-menu</div>
<div class="fontclass">#icon-android-menu</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-microphone-off"></use>
</svg>
<div class="name">android-microphone-off</div>
<div class="fontclass">#icon-android-microphone-off</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-person"></use>
</svg>
<div class="name">android-person</div>
<div class="fontclass">#icon-android-person</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-settings"></use>
</svg>
<div class="name">android-settings</div>
<div class="fontclass">#icon-android-settings</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-star-half"></use>
</svg>
<div class="name">android-star-half</div>
<div class="fontclass">#icon-android-star-half</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-time"></use>
</svg>
<div class="name">android-time</div>
<div class="fontclass">#icon-android-time</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-stopwatch"></use>
</svg>
<div class="name">android-stopwatch</div>
<div class="fontclass">#icon-android-stopwatch</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-volume-off"></use>
</svg>
<div class="name">android-volume-off</div>
<div class="fontclass">#icon-android-volume-off</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-aperture"></use>
</svg>
<div class="name">aperture</div>
<div class="fontclass">#icon-aperture</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-flame"></use>
</svg>
<div class="name">flame</div>
<div class="fontclass">#icon-flame</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-basketball"></use>
</svg>
<div class="name">ios-basketball</div>
<div class="fontclass">#icon-ios-basketball</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-skipforward-outline"></use>
</svg>
<div class="name">ios-skipforward-outline</div>
<div class="fontclass">#icon-ios-skipforward-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-no-smoking"></use>
</svg>
<div class="name">no-smoking</div>
<div class="fontclass">#icon-no-smoking</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-paintbucket"></use>
</svg>
<div class="name">paintbucket</div>
<div class="fontclass">#icon-paintbucket</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-pinterest-outline"></use>
</svg>
<div class="name">social-pinterest-outline</div>
<div class="fontclass">#icon-social-pinterest-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-python"></use>
</svg>
<div class="name">social-python</div>
<div class="fontclass">#icon-social-python</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-tumblr-outline"></use>
</svg>
<div class="name">social-tumblr-outline</div>
<div class="fontclass">#icon-social-tumblr-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-xbox"></use>
</svg>
<div class="name">xbox</div>
<div class="fontclass">#icon-xbox</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-calendar"></use>
</svg>
<div class="name">android-calendar</div>
<div class="fontclass">#icon-android-calendar</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-color-palette"></use>
</svg>
<div class="name">android-color-palette</div>
<div class="fontclass">#icon-android-color-palette</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-compass"></use>
</svg>
<div class="name">android-compass</div>
<div class="fontclass">#icon-android-compass</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-pin"></use>
</svg>
<div class="name">android-pin</div>
<div class="fontclass">#icon-android-pin</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-remove"></use>
</svg>
<div class="name">android-remove</div>
<div class="fontclass">#icon-android-remove</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ipod"></use>
</svg>
<div class="name">ipod</div>
<div class="fontclass">#icon-ipod</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ribbon-a"></use>
</svg>
<div class="name">ribbon-a</div>
<div class="fontclass">#icon-ribbon-a</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-bitcoin"></use>
</svg>
<div class="name">social-bitcoin</div>
<div class="fontclass">#icon-social-bitcoin</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-euro"></use>
</svg>
<div class="name">social-euro</div>
<div class="fontclass">#icon-social-euro</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-euro-outline"></use>
</svg>
<div class="name">social-euro-outline</div>
<div class="fontclass">#icon-social-euro-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-waterdrop"></use>
</svg>
<div class="name">waterdrop</div>
<div class="fontclass">#icon-waterdrop</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-bookmark"></use>
</svg>
<div class="name">android-bookmark</div>
<div class="fontclass">#icon-android-bookmark</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-car"></use>
</svg>
<div class="name">android-car</div>
<div class="fontclass">#icon-android-car</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-graph-up-right"></use>
</svg>
<div class="name">arrow-graph-up-right</div>
<div class="fontclass">#icon-arrow-graph-up-right</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-film-marker"></use>
</svg>
<div class="name">film-marker</div>
<div class="fontclass">#icon-film-marker</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-happy"></use>
</svg>
<div class="name">happy</div>
<div class="fontclass">#icon-happy</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-arrow-right"></use>
</svg>
<div class="name">ios-arrow-right</div>
<div class="fontclass">#icon-ios-arrow-right</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-arrow-up"></use>
</svg>
<div class="name">ios-arrow-up</div>
<div class="fontclass">#icon-ios-arrow-up</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-bookmarks"></use>
</svg>
<div class="name">ios-bookmarks</div>
<div class="fontclass">#icon-ios-bookmarks</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-compose-outline"></use>
</svg>
<div class="name">ios-compose-outline</div>
<div class="fontclass">#icon-ios-compose-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-minus"></use>
</svg>
<div class="name">ios-minus</div>
<div class="fontclass">#icon-ios-minus</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-monitor-outline"></use>
</svg>
<div class="name">ios-monitor-outline</div>
<div class="fontclass">#icon-ios-monitor-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-musical-note"></use>
</svg>
<div class="name">ios-musical-note</div>
<div class="fontclass">#icon-ios-musical-note</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-navigate-outline"></use>
</svg>
<div class="name">ios-navigate-outline</div>
<div class="fontclass">#icon-ios-navigate-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-stopwatch"></use>
</svg>
<div class="name">ios-stopwatch</div>
<div class="fontclass">#icon-ios-stopwatch</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-volume-high"></use>
</svg>
<div class="name">ios-volume-high</div>
<div class="fontclass">#icon-ios-volume-high</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-world"></use>
</svg>
<div class="name">ios-world</div>
<div class="fontclass">#icon-ios-world</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-jet"></use>
</svg>
<div class="name">jet</div>
<div class="fontclass">#icon-jet</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-knife"></use>
</svg>
<div class="name">knife</div>
<div class="fontclass">#icon-knife</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-magnet"></use>
</svg>
<div class="name">magnet</div>
<div class="fontclass">#icon-magnet</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-paintbrush"></use>
</svg>
<div class="name">paintbrush</div>
<div class="fontclass">#icon-paintbrush</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-radio-waves"></use>
</svg>
<div class="name">radio-waves</div>
<div class="fontclass">#icon-radio-waves</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-sad"></use>
</svg>
<div class="name">sad</div>
<div class="fontclass">#icon-sad</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-sad-outline"></use>
</svg>
<div class="name">sad-outline</div>
<div class="fontclass">#icon-sad-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-tshirt"></use>
</svg>
<div class="name">tshirt</div>
<div class="fontclass">#icon-tshirt</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-university"></use>
</svg>
<div class="name">university</div>
<div class="fontclass">#icon-university</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-earth"></use>
</svg>
<div class="name">earth</div>
<div class="fontclass">#icon-earth</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-error"></use>
</svg>
<div class="name">error</div>
<div class="fontclass">#icon-error</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-help"></use>
</svg>
<div class="name">help</div>
<div class="fontclass">#icon-help</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-pause"></use>
</svg>
<div class="name">pause</div>
<div class="fontclass">#icon-pause</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-upload"></use>
</svg>
<div class="name">upload</div>
<div class="fontclass">#icon-upload</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-copy-outline"></use>
</svg>
<div class="name">ios-copy-outline</div>
<div class="fontclass">#icon-ios-copy-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-plane"></use>
</svg>
<div class="name">plane</div>
<div class="fontclass">#icon-plane</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-power"></use>
</svg>
<div class="name">power</div>
<div class="fontclass">#icon-power</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-wand"></use>
</svg>
<div class="name">wand</div>
<div class="fontclass">#icon-wand</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-woman"></use>
</svg>
<div class="name">woman</div>
<div class="fontclass">#icon-woman</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-chatbubbles"></use>
</svg>
<div class="name">chatbubbles</div>
<div class="fontclass">#icon-chatbubbles</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-female"></use>
</svg>
<div class="name">female</div>
<div class="fontclass">#icon-female</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-heart"></use>
</svg>
<div class="name">ios-heart</div>
<div class="fontclass">#icon-ios-heart</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-keypad-outline"></use>
</svg>
<div class="name">ios-keypad-outline</div>
<div class="fontclass">#icon-ios-keypad-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-keypad"></use>
</svg>
<div class="name">ios-keypad</div>
<div class="fontclass">#icon-ios-keypad</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-time"></use>
</svg>
<div class="name">ios-time</div>
<div class="fontclass">#icon-ios-time</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-search"></use>
</svg>
<div class="name">android-search</div>
<div class="fontclass">#icon-android-search</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-arrow-dropup"></use>
</svg>
<div class="name">android-arrow-dropup</div>
<div class="fontclass">#icon-android-arrow-dropup</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-call"></use>
</svg>
<div class="name">android-call</div>
<div class="fontclass">#icon-android-call</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-clipboard"></use>
</svg>
<div class="name">android-clipboard</div>
<div class="fontclass">#icon-android-clipboard</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-drafts"></use>
</svg>
<div class="name">android-drafts</div>
<div class="fontclass">#icon-android-drafts</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-favorite"></use>
</svg>
<div class="name">android-favorite</div>
<div class="fontclass">#icon-android-favorite</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-home"></use>
</svg>
<div class="name">android-home</div>
<div class="fontclass">#icon-android-home</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-wifi"></use>
</svg>
<div class="name">android-wifi</div>
<div class="fontclass">#icon-android-wifi</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-walk"></use>
</svg>
<div class="name">android-walk</div>
<div class="fontclass">#icon-android-walk</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-calculator"></use>
</svg>
<div class="name">calculator</div>
<div class="fontclass">#icon-calculator</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-chatbox-working"></use>
</svg>
<div class="name">chatbox-working</div>
<div class="fontclass">#icon-chatbox-working</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-egg"></use>
</svg>
<div class="name">egg</div>
<div class="fontclass">#icon-egg</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-bell-outline"></use>
</svg>
<div class="name">ios-bell-outline</div>
<div class="fontclass">#icon-ios-bell-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-calendar-outline"></use>
</svg>
<div class="name">ios-calendar-outline</div>
<div class="fontclass">#icon-ios-calendar-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-compose"></use>
</svg>
<div class="name">ios-compose</div>
<div class="fontclass">#icon-ios-compose</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-grid-view"></use>
</svg>
<div class="name">ios-grid-view</div>
<div class="fontclass">#icon-ios-grid-view</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-more"></use>
</svg>
<div class="name">ios-more</div>
<div class="fontclass">#icon-ios-more</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-musical-notes"></use>
</svg>
<div class="name">ios-musical-notes</div>
<div class="fontclass">#icon-ios-musical-notes</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-person-outline"></use>
</svg>
<div class="name">ios-person-outline</div>
<div class="fontclass">#icon-ios-person-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-pricetags"></use>
</svg>
<div class="name">ios-pricetags</div>
<div class="fontclass">#icon-ios-pricetags</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-sunny-outline"></use>
</svg>
<div class="name">ios-sunny-outline</div>
<div class="fontclass">#icon-ios-sunny-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-key"></use>
</svg>
<div class="name">key</div>
<div class="fontclass">#icon-key</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-planet"></use>
</svg>
<div class="name">planet</div>
<div class="fontclass">#icon-planet</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-pull-request"></use>
</svg>
<div class="name">pull-request</div>
<div class="fontclass">#icon-pull-request</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-stats-bars"></use>
</svg>
<div class="name">stats-bars</div>
<div class="fontclass">#icon-stats-bars</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-steam"></use>
</svg>
<div class="name">steam</div>
<div class="fontclass">#icon-steam</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-umbrella"></use>
</svg>
<div class="name">umbrella</div>
<div class="fontclass">#icon-umbrella</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-volume-low"></use>
</svg>
<div class="name">volume-low</div>
<div class="fontclass">#icon-volume-low</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-accessory"></use>
</svg>
<div class="name">accessory</div>
<div class="fontclass">#icon-accessory</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-activity"></use>
</svg>
<div class="name">activity</div>
<div class="fontclass">#icon-activity</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-activity_fill"></use>
</svg>
<div class="name">activity_fill</div>
<div class="fontclass">#icon-activity_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-add"></use>
</svg>
<div class="name">add</div>
<div class="fontclass">#icon-add</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-addition_fill"></use>
</svg>
<div class="name">addition_fill</div>
<div class="fontclass">#icon-addition_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-addition"></use>
</svg>
<div class="name">addition</div>
<div class="fontclass">#icon-addition</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-addpeople_fill"></use>
</svg>
<div class="name">addpeople_fill</div>
<div class="fontclass">#icon-addpeople_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-addpeople"></use>
</svg>
<div class="name">addpeople</div>
<div class="fontclass">#icon-addpeople</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-addressbook_fill"></use>
</svg>
<div class="name">addressbook_fill</div>
<div class="fontclass">#icon-addressbook_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-addressbook"></use>
</svg>
<div class="name">addressbook</div>
<div class="fontclass">#icon-addressbook</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-barrage_fill"></use>
</svg>
<div class="name">barrage_fill</div>
<div class="fontclass">#icon-barrage_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-barrage"></use>
</svg>
<div class="name">barrage</div>
<div class="fontclass">#icon-barrage</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-browse_fill"></use>
</svg>
<div class="name">browse_fill</div>
<div class="fontclass">#icon-browse_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-browse"></use>
</svg>
<div class="name">browse</div>
<div class="fontclass">#icon-browse</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-brush"></use>
</svg>
<div class="name">brush</div>
<div class="fontclass">#icon-brush</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-brush_fill"></use>
</svg>
<div class="name">brush_fill</div>
<div class="fontclass">#icon-brush_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-businesscard_fill"></use>
</svg>
<div class="name">businesscard_fill</div>
<div class="fontclass">#icon-businesscard_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-businesscard"></use>
</svg>
<div class="name">businesscard</div>
<div class="fontclass">#icon-businesscard</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-camera_fill"></use>
</svg>
<div class="name">camera_fill</div>
<div class="fontclass">#icon-camera_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-camera"></use>
</svg>
<div class="name">camera</div>
<div class="fontclass">#icon-camera</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-clock_fill"></use>
</svg>
<div class="name">clock_fill</div>
<div class="fontclass">#icon-clock_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-clock"></use>
</svg>
<div class="name">clock</div>
<div class="fontclass">#icon-clock</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-close"></use>
</svg>
<div class="name">close</div>
<div class="fontclass">#icon-close</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-collection_fill"></use>
</svg>
<div class="name">collection_fill</div>
<div class="fontclass">#icon-collection_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-collection"></use>
</svg>
<div class="name">collection</div>
<div class="fontclass">#icon-collection</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-computer_fill"></use>
</svg>
<div class="name">computer_fill</div>
<div class="fontclass">#icon-computer_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-computer"></use>
</svg>
<div class="name">computer</div>
<div class="fontclass">#icon-computer</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-coordinates_fill"></use>
</svg>
<div class="name">coordinates_fill</div>
<div class="fontclass">#icon-coordinates_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-coordinates"></use>
</svg>
<div class="name">coordinates</div>
<div class="fontclass">#icon-coordinates</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-coupons_fill"></use>
</svg>
<div class="name">coupons_fill</div>
<div class="fontclass">#icon-coupons_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-coupons"></use>
</svg>
<div class="name">coupons</div>
<div class="fontclass">#icon-coupons</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-createtask_fill"></use>
</svg>
<div class="name">createtask_fill</div>
<div class="fontclass">#icon-createtask_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-createtask"></use>
</svg>
<div class="name">createtask</div>
<div class="fontclass">#icon-createtask</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-customer-service_fill"></use>
</svg>
<div class="name">customerservice_fill</div>
<div class="fontclass">#icon-customer-service_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-delete_fill"></use>
</svg>
<div class="name">delete_fill</div>
<div class="fontclass">#icon-delete_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-delete"></use>
</svg>
<div class="name">delete</div>
<div class="fontclass">#icon-delete</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-document"></use>
</svg>
<div class="name">document</div>
<div class="fontclass">#icon-document</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-document_fill"></use>
</svg>
<div class="name">document_fill</div>
<div class="fontclass">#icon-document_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-dynamic_fill"></use>
</svg>
<div class="name">dynamic_fill</div>
<div class="fontclass">#icon-dynamic_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-dynamic"></use>
</svg>
<div class="name">dynamic</div>
<div class="fontclass">#icon-dynamic</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-editor"></use>
</svg>
<div class="name">editor</div>
<div class="fontclass">#icon-editor</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-eit"></use>
</svg>
<div class="name">eit</div>
<div class="fontclass">#icon-eit</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-emoji_fill"></use>
</svg>
<div class="name">emoji_fill</div>
<div class="fontclass">#icon-emoji_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-emoji"></use>
</svg>
<div class="name">emoji</div>
<div class="fontclass">#icon-emoji</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-empty"></use>
</svg>
<div class="name">empty</div>
<div class="fontclass">#icon-empty</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-empty_fill"></use>
</svg>
<div class="name">empty_fill</div>
<div class="fontclass">#icon-empty_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-enter"></use>
</svg>
<div class="name">enter</div>
<div class="fontclass">#icon-enter</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-enterinto"></use>
</svg>
<div class="name">enterinto</div>
<div class="fontclass">#icon-enterinto</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-enterinto_fill"></use>
</svg>
<div class="name">enterinto_fill</div>
<div class="fontclass">#icon-enterinto_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-feedback_fill"></use>
</svg>
<div class="name">feedback_fill</div>
<div class="fontclass">#icon-feedback_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-feedback"></use>
</svg>
<div class="name">feedback</div>
<div class="fontclass">#icon-feedback</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-flag_fill"></use>
</svg>
<div class="name">flag_fill</div>
<div class="fontclass">#icon-flag_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-flag"></use>
</svg>
<div class="name">flag</div>
<div class="fontclass">#icon-flag</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-flashlight"></use>
</svg>
<div class="name">flashlight</div>
<div class="fontclass">#icon-flashlight</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-flashlight_fill"></use>
</svg>
<div class="name">flashlight_fill</div>
<div class="fontclass">#icon-flashlight_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-flip"></use>
</svg>
<div class="name">flip</div>
<div class="fontclass">#icon-flip</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-flip_fill"></use>
</svg>
<div class="name">flip_fill</div>
<div class="fontclass">#icon-flip_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-fullscreen"></use>
</svg>
<div class="name">fullscreen</div>
<div class="fontclass">#icon-fullscreen</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-group"></use>
</svg>
<div class="name">group</div>
<div class="fontclass">#icon-group</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-group_fill"></use>
</svg>
<div class="name">group_fill</div>
<div class="fontclass">#icon-group_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-headlines_fill"></use>
</svg>
<div class="name">headlines_fill</div>
<div class="fontclass">#icon-headlines_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-headlines"></use>
</svg>
<div class="name">headlines</div>
<div class="fontclass">#icon-headlines</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-homepage_fill"></use>
</svg>
<div class="name">homepage_fill</div>
<div class="fontclass">#icon-homepage_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-homepage"></use>
</svg>
<div class="name">homepage</div>
<div class="fontclass">#icon-homepage</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-integral_fill"></use>
</svg>
<div class="name">integral_fill</div>
<div class="fontclass">#icon-integral_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-integral"></use>
</svg>
<div class="name">integral</div>
<div class="fontclass">#icon-integral</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-interactive_fill"></use>
</svg>
<div class="name">interactive_fill</div>
<div class="fontclass">#icon-interactive_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-interactive"></use>
</svg>
<div class="name">interactive</div>
<div class="fontclass">#icon-interactive</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-keyboard"></use>
</svg>
<div class="name">keyboard</div>
<div class="fontclass">#icon-keyboard</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-label"></use>
</svg>
<div class="name">label</div>
<div class="fontclass">#icon-label</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-label_fill"></use>
</svg>
<div class="name">label_fill</div>
<div class="fontclass">#icon-label_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-like_fill"></use>
</svg>
<div class="name">like_fill</div>
<div class="fontclass">#icon-like_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-like"></use>
</svg>
<div class="name">like</div>
<div class="fontclass">#icon-like</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-live_fill"></use>
</svg>
<div class="name">live_fill</div>
<div class="fontclass">#icon-live_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-live"></use>
</svg>
<div class="name">live</div>
<div class="fontclass">#icon-live</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-lock_fill"></use>
</svg>
<div class="name">lock_fill</div>
<div class="fontclass">#icon-lock_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-lock"></use>
</svg>
<div class="name">lock</div>
<div class="fontclass">#icon-lock</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-mail"></use>
</svg>
<div class="name">mail</div>
<div class="fontclass">#icon-mail</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-mail_fill"></use>
</svg>
<div class="name">mail_fill</div>
<div class="fontclass">#icon-mail_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-manage_fill"></use>
</svg>
<div class="name">manage_fill</div>
<div class="fontclass">#icon-manage_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-manage"></use>
</svg>
<div class="name">manage</div>
<div class="fontclass">#icon-manage</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-message"></use>
</svg>
<div class="name">message</div>
<div class="fontclass">#icon-message</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-message_fill"></use>
</svg>
<div class="name">message_fill</div>
<div class="fontclass">#icon-message_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-mine"></use>
</svg>
<div class="name">mine</div>
<div class="fontclass">#icon-mine</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-mine_fill"></use>
</svg>
<div class="name">mine_fill</div>
<div class="fontclass">#icon-mine_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-mobilephone_fill"></use>
</svg>
<div class="name">mobilephone_fill</div>
<div class="fontclass">#icon-mobilephone_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-mobilephone"></use>
</svg>
<div class="name">mobilephone</div>
<div class="fontclass">#icon-mobilephone</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-more"></use>
</svg>
<div class="name">more</div>
<div class="fontclass">#icon-more</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-narrow"></use>
</svg>
<div class="name">narrow</div>
<div class="fontclass">#icon-narrow</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-offline_fill"></use>
</svg>
<div class="name">offline_fill</div>
<div class="fontclass">#icon-offline_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-offline"></use>
</svg>
<div class="name">offline</div>
<div class="fontclass">#icon-offline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-order_fill"></use>
</svg>
<div class="name">order_fill</div>
<div class="fontclass">#icon-order_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-order"></use>
</svg>
<div class="name">order</div>
<div class="fontclass">#icon-order</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-other"></use>
</svg>
<div class="name">other</div>
<div class="fontclass">#icon-other</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-people_fill"></use>
</svg>
<div class="name">people_fill</div>
<div class="fontclass">#icon-people_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-people"></use>
</svg>
<div class="name">people</div>
<div class="fontclass">#icon-people</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-picture_fill"></use>
</svg>
<div class="name">picture_fill</div>
<div class="fontclass">#icon-picture_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-picture"></use>
</svg>
<div class="name">picture</div>
<div class="fontclass">#icon-picture</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-play"></use>
</svg>
<div class="name">play</div>
<div class="fontclass">#icon-play</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-play_fill"></use>
</svg>
<div class="name">play_fill</div>
<div class="fontclass">#icon-play_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-playon_fill"></use>
</svg>
<div class="name">playon_fill</div>
<div class="fontclass">#icon-playon_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-playon"></use>
</svg>
<div class="name">playon</div>
<div class="fontclass">#icon-playon</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-praise_fill"></use>
</svg>
<div class="name">praise_fill</div>
<div class="fontclass">#icon-praise_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-praise"></use>
</svg>
<div class="name">praise</div>
<div class="fontclass">#icon-praise</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-prompt_fill"></use>
</svg>
<div class="name">prompt_fill</div>
<div class="fontclass">#icon-prompt_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-prompt"></use>
</svg>
<div class="name">prompt</div>
<div class="fontclass">#icon-prompt</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-qrcode_fill"></use>
</svg>
<div class="name">qrcode_fill</div>
<div class="fontclass">#icon-qrcode_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-qrcode"></use>
</svg>
<div class="name">qrcode</div>
<div class="fontclass">#icon-qrcode</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-redpacket_fill"></use>
</svg>
<div class="name">redpacket_fill</div>
<div class="fontclass">#icon-redpacket_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-redpacket"></use>
</svg>
<div class="name">redpacket</div>
<div class="fontclass">#icon-redpacket</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-refresh"></use>
</svg>
<div class="name">refresh</div>
<div class="fontclass">#icon-refresh</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-remind_fill"></use>
</svg>
<div class="name">remind_fill</div>
<div class="fontclass">#icon-remind_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-remind"></use>
</svg>
<div class="name">remind</div>
<div class="fontclass">#icon-remind</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-return"></use>
</svg>
<div class="name">return</div>
<div class="fontclass">#icon-return</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-right"></use>
</svg>
<div class="name">right</div>
<div class="fontclass">#icon-right</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-scan"></use>
</svg>
<div class="name">scan</div>
<div class="fontclass">#icon-scan</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-select_fill"></use>
</svg>
<div class="name">select_fill</div>
<div class="fontclass">#icon-select_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-select"></use>
</svg>
<div class="name">select</div>
<div class="fontclass">#icon-select</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-send"></use>
</svg>
<div class="name">send</div>
<div class="fontclass">#icon-send</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-service_fill"></use>
</svg>
<div class="name">service_fill</div>
<div class="fontclass">#icon-service_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-service"></use>
</svg>
<div class="name">service</div>
<div class="fontclass">#icon-service</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-setup_fill"></use>
</svg>
<div class="name">setup_fill</div>
<div class="fontclass">#icon-setup_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-setup"></use>
</svg>
<div class="name">setup</div>
<div class="fontclass">#icon-setup</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-share_fill"></use>
</svg>
<div class="name">share_fill</div>
<div class="fontclass">#icon-share_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-share"></use>
</svg>
<div class="name">share</div>
<div class="fontclass">#icon-share</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-shielding_fill"></use>
</svg>
<div class="name">shielding_fill</div>
<div class="fontclass">#icon-shielding_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-shielding"></use>
</svg>
<div class="name">shielding</div>
<div class="fontclass">#icon-shielding</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-smallscreen_fill"></use>
</svg>
<div class="name">smallscreen_fill</div>
<div class="fontclass">#icon-smallscreen_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-smallscreen"></use>
</svg>
<div class="name">smallscreen</div>
<div class="fontclass">#icon-smallscreen</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-stealth_fill"></use>
</svg>
<div class="name">stealth_fill</div>
<div class="fontclass">#icon-stealth_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-stealth"></use>
</svg>
<div class="name">stealth</div>
<div class="fontclass">#icon-stealth</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-success_fill"></use>
</svg>
<div class="name">success_fill</div>
<div class="fontclass">#icon-success_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-success"></use>
</svg>
<div class="name">success</div>
<div class="fontclass">#icon-success</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-suspend"></use>
</svg>
<div class="name">suspend</div>
<div class="fontclass">#icon-suspend</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-switch"></use>
</svg>
<div class="name">switch</div>
<div class="fontclass">#icon-switch</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-systemprompt_fill"></use>
</svg>
<div class="name">systemprompt_fill</div>
<div class="fontclass">#icon-systemprompt_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-systemprompt"></use>
</svg>
<div class="name">systemprompt</div>
<div class="fontclass">#icon-systemprompt</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-tailor"></use>
</svg>
<div class="name">tailor</div>
<div class="fontclass">#icon-tailor</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-task"></use>
</svg>
<div class="name">task</div>
<div class="fontclass">#icon-task</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-task_fill"></use>
</svg>
<div class="name">task_fill</div>
<div class="fontclass">#icon-task_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-tasklist_fill"></use>
</svg>
<div class="name">tasklist_fill</div>
<div class="fontclass">#icon-tasklist_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-tasklist"></use>
</svg>
<div class="name">tasklist</div>
<div class="fontclass">#icon-tasklist</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-text"></use>
</svg>
<div class="name">text</div>
<div class="fontclass">#icon-text</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-time_fill"></use>
</svg>
<div class="name">time_fill</div>
<div class="fontclass">#icon-time_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-time"></use>
</svg>
<div class="name">time</div>
<div class="fontclass">#icon-time</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-translation_fill"></use>
</svg>
<div class="name">translation_fill</div>
<div class="fontclass">#icon-translation_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-translation"></use>
</svg>
<div class="name">translation</div>
<div class="fontclass">#icon-translation</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-trash"></use>
</svg>
<div class="name">trash</div>
<div class="fontclass">#icon-trash</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-trash_fill"></use>
</svg>
<div class="name">trash_fill</div>
<div class="fontclass">#icon-trash_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-undo"></use>
</svg>
<div class="name">undo</div>
<div class="fontclass">#icon-undo</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-unlock_fill"></use>
</svg>
<div class="name">unlock_fill</div>
<div class="fontclass">#icon-unlock_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-unlock"></use>
</svg>
<div class="name">unlock</div>
<div class="fontclass">#icon-unlock</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-video"></use>
</svg>
<div class="name">video</div>
<div class="fontclass">#icon-video</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-video_fill"></use>
</svg>
<div class="name">video_fill</div>
<div class="fontclass">#icon-video_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-warning_fill"></use>
</svg>
<div class="name">warning_fill</div>
<div class="fontclass">#icon-warning_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-warning"></use>
</svg>
<div class="name">warning</div>
<div class="fontclass">#icon-warning</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-workbench_fill"></use>
</svg>
<div class="name">workbench_fill</div>
<div class="fontclass">#icon-workbench_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-workbench"></use>
</svg>
<div class="name">workbench</div>
<div class="fontclass">#icon-workbench</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-apps"></use>
</svg>
<div class="name">android-apps</div>
<div class="fontclass">#icon-android-apps</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-folder-open"></use>
</svg>
<div class="name">android-folder-open</div>
<div class="fontclass">#icon-android-folder-open</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-hangout"></use>
</svg>
<div class="name">android-hangout</div>
<div class="fontclass">#icon-android-hangout</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-refresh"></use>
</svg>
<div class="name">android-refresh</div>
<div class="fontclass">#icon-android-refresh</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-train"></use>
</svg>
<div class="name">android-train</div>
<div class="fontclass">#icon-android-train</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ipad"></use>
</svg>
<div class="name">ipad</div>
<div class="fontclass">#icon-ipad</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-chatbox"></use>
</svg>
<div class="name">chatbox</div>
<div class="fontclass">#icon-chatbox</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-cloud-download"></use>
</svg>
<div class="name">ios-cloud-download</div>
<div class="fontclass">#icon-ios-cloud-download</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-photos"></use>
</svg>
<div class="name">ios-photos</div>
<div class="fontclass">#icon-ios-photos</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-redo-outline"></use>
</svg>
<div class="name">ios-redo-outline</div>
<div class="fontclass">#icon-ios-redo-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-redo"></use>
</svg>
<div class="name">ios-redo</div>
<div class="fontclass">#icon-ios-redo</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-toggle"></use>
</svg>
<div class="name">ios-toggle</div>
<div class="fontclass">#icon-ios-toggle</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-monitor"></use>
</svg>
<div class="name">monitor</div>
<div class="fontclass">#icon-monitor</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-pound"></use>
</svg>
<div class="name">pound</div>
<div class="fontclass">#icon-pound</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-pricetag"></use>
</svg>
<div class="name">pricetag</div>
<div class="fontclass">#icon-pricetag</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-thermometer"></use>
</svg>
<div class="name">thermometer</div>
<div class="fontclass">#icon-thermometer</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-usb"></use>
</svg>
<div class="name">usb</div>
<div class="fontclass">#icon-usb</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-search"></use>
</svg>
<div class="name">search</div>
<div class="fontclass">#icon-search</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-searchfill"></use>
</svg>
<div class="name">search fill</div>
<div class="fontclass">#icon-searchfill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-shop_fill"></use>
</svg>
<div class="name">shop_fill</div>
<div class="fontclass">#icon-shop_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-transaction_fill"></use>
</svg>
<div class="name">transaction_fill</div>
<div class="fontclass">#icon-transaction_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-packup"></use>
</svg>
<div class="name">packup</div>
<div class="fontclass">#icon-packup</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-unfold"></use>
</svg>
<div class="name">unfold</div>
<div class="fontclass">#icon-unfold</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-financial_fill"></use>
</svg>
<div class="name">financial_fill</div>
<div class="fontclass">#icon-financial_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-alarm-clock"></use>
</svg>
<div class="name">android-alarm-clock</div>
<div class="fontclass">#icon-android-alarm-clock</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-add-circle"></use>
</svg>
<div class="name">android-add-circle</div>
<div class="fontclass">#icon-android-add-circle</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-arrow-up"></use>
</svg>
<div class="name">android-arrow-up</div>
<div class="fontclass">#icon-android-arrow-up</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-cloud-done"></use>
</svg>
<div class="name">android-cloud-done</div>
<div class="fontclass">#icon-android-cloud-done</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-subway"></use>
</svg>
<div class="name">android-subway</div>
<div class="fontclass">#icon-android-subway</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-unlock"></use>
</svg>
<div class="name">android-unlock</div>
<div class="fontclass">#icon-android-unlock</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-volume-mute"></use>
</svg>
<div class="name">android-volume-mute</div>
<div class="fontclass">#icon-android-volume-mute</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-images"></use>
</svg>
<div class="name">images</div>
<div class="fontclass">#icon-images</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-arrow-back"></use>
</svg>
<div class="name">ios-arrow-back</div>
<div class="fontclass">#icon-ios-arrow-back</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-circle-outline"></use>
</svg>
<div class="name">ios-circle-outline</div>
<div class="fontclass">#icon-ios-circle-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-football-outline"></use>
</svg>
<div class="name">ios-football-outline</div>
<div class="fontclass">#icon-ios-football-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-gear"></use>
</svg>
<div class="name">ios-gear</div>
<div class="fontclass">#icon-ios-gear</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-list-outline"></use>
</svg>
<div class="name">ios-list-outline</div>
<div class="fontclass">#icon-ios-list-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-paper-outline"></use>
</svg>
<div class="name">ios-paper-outline</div>
<div class="fontclass">#icon-ios-paper-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-star"></use>
</svg>
<div class="name">ios-star</div>
<div class="fontclass">#icon-ios-star</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-levels"></use>
</svg>
<div class="name">levels</div>
<div class="fontclass">#icon-levels</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-lightbulb"></use>
</svg>
<div class="name">lightbulb</div>
<div class="fontclass">#icon-lightbulb</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-music-note"></use>
</svg>
<div class="name">music-note</div>
<div class="fontclass">#icon-music-note</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-record"></use>
</svg>
<div class="name">record</div>
<div class="fontclass">#icon-record</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-shake"></use>
</svg>
<div class="name">shake</div>
<div class="fontclass">#icon-shake</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-decoration_fill"></use>
</svg>
<div class="name">decoration_fill</div>
<div class="fontclass">#icon-decoration_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-list"></use>
</svg>
<div class="name">ios-list</div>
<div class="fontclass">#icon-ios-list</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-attach"></use>
</svg>
<div class="name">android-attach</div>
<div class="fontclass">#icon-android-attach</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-cloud-circle"></use>
</svg>
<div class="name">android-cloud-circle</div>
<div class="fontclass">#icon-android-cloud-circle</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-microphone"></use>
</svg>
<div class="name">android-microphone</div>
<div class="fontclass">#icon-android-microphone</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-happy-outline"></use>
</svg>
<div class="name">happy-outline</div>
<div class="fontclass">#icon-happy-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-circle-filled"></use>
</svg>
<div class="name">ios-circle-filled</div>
<div class="fontclass">#icon-ios-circle-filled</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-information"></use>
</svg>
<div class="name">ios-information</div>
<div class="fontclass">#icon-ios-information</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-medkit-outline"></use>
</svg>
<div class="name">ios-medkit-outline</div>
<div class="fontclass">#icon-ios-medkit-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-pause"></use>
</svg>
<div class="name">ios-pause</div>
<div class="fontclass">#icon-ios-pause</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-settings-strong"></use>
</svg>
<div class="name">ios-settings-strong</div>
<div class="fontclass">#icon-ios-settings-strong</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-male"></use>
</svg>
<div class="name">male</div>
<div class="fontclass">#icon-male</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-information-outl"></use>
</svg>
<div class="name">ios-information-outl</div>
<div class="fontclass">#icon-ios-information-outl</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-hand"></use>
</svg>
<div class="name">android-hand</div>
<div class="fontclass">#icon-android-hand</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-share-alt"></use>
</svg>
<div class="name">android-share-alt</div>
<div class="fontclass">#icon-android-share-alt</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-upload"></use>
</svg>
<div class="name">android-upload</div>
<div class="fontclass">#icon-android-upload</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-bonfire"></use>
</svg>
<div class="name">bonfire</div>
<div class="fontclass">#icon-bonfire</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-crop"></use>
</svg>
<div class="name">crop</div>
<div class="fontclass">#icon-crop</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-arrow-forward"></use>
</svg>
<div class="name">ios-arrow-forward</div>
<div class="fontclass">#icon-ios-arrow-forward</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-at"></use>
</svg>
<div class="name">ios-at</div>
<div class="fontclass">#icon-ios-at</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-world-outline"></use>
</svg>
<div class="name">ios-world-outline</div>
<div class="fontclass">#icon-ios-world-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-navigate"></use>
</svg>
<div class="name">navigate</div>
<div class="fontclass">#icon-navigate</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-podium"></use>
</svg>
<div class="name">podium</div>
<div class="fontclass">#icon-podium</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-code-download"></use>
</svg>
<div class="name">code-download</div>
<div class="fontclass">#icon-code-download</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-mic-a"></use>
</svg>
<div class="name">mic-a</div>
<div class="fontclass">#icon-mic-a</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-bicycle"></use>
</svg>
<div class="name">android-bicycle</div>
<div class="fontclass">#icon-android-bicycle</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-pie"></use>
</svg>
<div class="name">ios-pie</div>
<div class="fontclass">#icon-ios-pie</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-fireball"></use>
</svg>
<div class="name">fireball</div>
<div class="fontclass">#icon-fireball</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-football"></use>
</svg>
<div class="name">ios-football</div>
<div class="fontclass">#icon-ios-football</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-star-half"></use>
</svg>
<div class="name">ios-star-half</div>
<div class="fontclass">#icon-ios-star-half</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-network"></use>
</svg>
<div class="name">network</div>
<div class="fontclass">#icon-network</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-pin"></use>
</svg>
<div class="name">pin</div>
<div class="fontclass">#icon-pin</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-skip-forward"></use>
</svg>
<div class="name">skip-forward</div>
<div class="fontclass">#icon-skip-forward</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-trophy"></use>
</svg>
<div class="name">trophy</div>
<div class="fontclass">#icon-trophy</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-volume-medium"></use>
</svg>
<div class="name">volume-medium</div>
<div class="fontclass">#icon-volume-medium</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-cloud"></use>
</svg>
<div class="name">android-cloud</div>
<div class="fontclass">#icon-android-cloud</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-funnel"></use>
</svg>
<div class="name">android-funnel</div>
<div class="fontclass">#icon-android-funnel</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-graph-up-left"></use>
</svg>
<div class="name">arrow-graph-up-left</div>
<div class="fontclass">#icon-arrow-graph-up-left</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-alarm-outline"></use>
</svg>
<div class="name">ios-alarm-outline</div>
<div class="fontclass">#icon-ios-alarm-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-down-c"></use>
</svg>
<div class="name">arrow-down-c</div>
<div class="fontclass">#icon-arrow-down-c</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-down-a"></use>
</svg>
<div class="name">arrow-down-a</div>
<div class="fontclass">#icon-arrow-down-a</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-left-b"></use>
</svg>
<div class="name">arrow-left-b</div>
<div class="fontclass">#icon-arrow-left-b</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-expand"></use>
</svg>
<div class="name">arrow-expand</div>
<div class="fontclass">#icon-arrow-expand</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-down-b"></use>
</svg>
<div class="name">arrow-down-b</div>
<div class="fontclass">#icon-arrow-down-b</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-left-a"></use>
</svg>
<div class="name">arrow-left-a</div>
<div class="fontclass">#icon-arrow-left-a</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-left-c"></use>
</svg>
<div class="name">arrow-left-c</div>
<div class="fontclass">#icon-arrow-left-c</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-return-left"></use>
</svg>
<div class="name">arrow-return-left</div>
<div class="fontclass">#icon-arrow-return-left</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-move"></use>
</svg>
<div class="name">arrow-move</div>
<div class="fontclass">#icon-arrow-move</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-right-a"></use>
</svg>
<div class="name">arrow-right-a</div>
<div class="fontclass">#icon-arrow-right-a</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-return-right"></use>
</svg>
<div class="name">arrow-return-right</div>
<div class="fontclass">#icon-arrow-return-right</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-swap"></use>
</svg>
<div class="name">arrow-swap</div>
<div class="fontclass">#icon-arrow-swap</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-shrink"></use>
</svg>
<div class="name">arrow-shrink</div>
<div class="fontclass">#icon-arrow-shrink</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-right-b"></use>
</svg>
<div class="name">arrow-right-b</div>
<div class="fontclass">#icon-arrow-right-b</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-right-c"></use>
</svg>
<div class="name">arrow-right-c</div>
<div class="fontclass">#icon-arrow-right-c</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-up-a"></use>
</svg>
<div class="name">arrow-up-a</div>
<div class="fontclass">#icon-arrow-up-a</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-chevron-down"></use>
</svg>
<div class="name">chevron-down</div>
<div class="fontclass">#icon-chevron-down</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-up-b"></use>
</svg>
<div class="name">arrow-up-b</div>
<div class="fontclass">#icon-arrow-up-b</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-chevron-right"></use>
</svg>
<div class="name">chevron-right</div>
<div class="fontclass">#icon-chevron-right</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-chevron-up"></use>
</svg>
<div class="name">chevron-up</div>
<div class="fontclass">#icon-chevron-up</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-drag"></use>
</svg>
<div class="name">drag</div>
<div class="fontclass">#icon-drag</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-up-c"></use>
</svg>
<div class="name">arrow-up-c</div>
<div class="fontclass">#icon-arrow-up-c</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-chevron-left"></use>
</svg>
<div class="name">chevron-left</div>
<div class="fontclass">#icon-chevron-left</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-navicon-round"></use>
</svg>
<div class="name">navicon-round</div>
<div class="fontclass">#icon-navicon-round</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ionic"></use>
</svg>
<div class="name">ionic</div>
<div class="fontclass">#icon-ionic</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-navicon"></use>
</svg>
<div class="name">navicon</div>
<div class="fontclass">#icon-navicon</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-alert"></use>
</svg>
<div class="name">alert</div>
<div class="fontclass">#icon-alert</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-asterisk"></use>
</svg>
<div class="name">asterisk</div>
<div class="fontclass">#icon-asterisk</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-checkmark-circled"></use>
</svg>
<div class="name">checkmark-circled</div>
<div class="fontclass">#icon-checkmark-circled</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-alert-circled"></use>
</svg>
<div class="name">alert-circled</div>
<div class="fontclass">#icon-alert-circled</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-backspace"></use>
</svg>
<div class="name">backspace</div>
<div class="fontclass">#icon-backspace</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-checkmark"></use>
</svg>
<div class="name">checkmark</div>
<div class="fontclass">#icon-checkmark</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-backspace-outline"></use>
</svg>
<div class="name">backspace-outline</div>
<div class="fontclass">#icon-backspace-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-close-round"></use>
</svg>
<div class="name">close-round</div>
<div class="fontclass">#icon-close-round</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-closecircled"></use>
</svg>
<div class="name">closecircled</div>
<div class="fontclass">#icon-closecircled</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-help-buoy"></use>
</svg>
<div class="name">help-buoy</div>
<div class="fontclass">#icon-help-buoy</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-checkmark-round"></use>
</svg>
<div class="name">checkmark-round</div>
<div class="fontclass">#icon-checkmark-round</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-home"></use>
</svg>
<div class="name">home</div>
<div class="fontclass">#icon-home</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-help-circled"></use>
</svg>
<div class="name">help-circled</div>
<div class="fontclass">#icon-help-circled</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-log-in"></use>
</svg>
<div class="name">log-in</div>
<div class="fontclass">#icon-log-in</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-information-circled"></use>
</svg>
<div class="name">information-circled</div>
<div class="fontclass">#icon-information-circled</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-information"></use>
</svg>
<div class="name">information</div>
<div class="fontclass">#icon-information</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-log-out"></use>
</svg>
<div class="name">log-out</div>
<div class="fontclass">#icon-log-out</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-minus-circled"></use>
</svg>
<div class="name">minus-circled</div>
<div class="fontclass">#icon-minus-circled</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-minus-round"></use>
</svg>
<div class="name">minus-round</div>
<div class="fontclass">#icon-minus-round</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-plus-circled"></use>
</svg>
<div class="name">plus-circled</div>
<div class="fontclass">#icon-plus-circled</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-minus"></use>
</svg>
<div class="name">minus</div>
<div class="fontclass">#icon-minus</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-loop"></use>
</svg>
<div class="name">loop</div>
<div class="fontclass">#icon-loop</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-plus"></use>
</svg>
<div class="name">plus</div>
<div class="fontclass">#icon-plus</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-plus-round"></use>
</svg>
<div class="name">plus-round</div>
<div class="fontclass">#icon-plus-round</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-shuffle"></use>
</svg>
<div class="name">shuffle</div>
<div class="fontclass">#icon-shuffle</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-document-text"></use>
</svg>
<div class="name">document-text</div>
<div class="fontclass">#icon-document-text</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-compose"></use>
</svg>
<div class="name">compose</div>
<div class="fontclass">#icon-compose</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-bookmark"></use>
</svg>
<div class="name">bookmark</div>
<div class="fontclass">#icon-bookmark</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-archive"></use>
</svg>
<div class="name">archive</div>
<div class="fontclass">#icon-archive</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-clipboard"></use>
</svg>
<div class="name">clipboard</div>
<div class="fontclass">#icon-clipboard</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-edit"></use>
</svg>
<div class="name">edit</div>
<div class="fontclass">#icon-edit</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-email-unread"></use>
</svg>
<div class="name">email-unread</div>
<div class="fontclass">#icon-email-unread</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-email"></use>
</svg>
<div class="name">email</div>
<div class="fontclass">#icon-email</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-folder"></use>
</svg>
<div class="name">folder</div>
<div class="fontclass">#icon-folder</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-forward"></use>
</svg>
<div class="name">forward</div>
<div class="fontclass">#icon-forward</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-heart-broken"></use>
</svg>
<div class="name">heart-broken</div>
<div class="fontclass">#icon-heart-broken</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-gear-a"></use>
</svg>
<div class="name">gear-a</div>
<div class="fontclass">#icon-gear-a</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-gear-b"></use>
</svg>
<div class="name">gear-b</div>
<div class="fontclass">#icon-gear-b</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-hammer"></use>
</svg>
<div class="name">hammer</div>
<div class="fontclass">#icon-hammer</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-heart"></use>
</svg>
<div class="name">heart</div>
<div class="fontclass">#icon-heart</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-paper-airplane"></use>
</svg>
<div class="name">paper-airplane</div>
<div class="fontclass">#icon-paper-airplane</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-link"></use>
</svg>
<div class="name">link</div>
<div class="fontclass">#icon-link</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-funnel"></use>
</svg>
<div class="name">funnel</div>
<div class="fontclass">#icon-funnel</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-reply"></use>
</svg>
<div class="name">reply</div>
<div class="fontclass">#icon-reply</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-settings"></use>
</svg>
<div class="name">settings</div>
<div class="fontclass">#icon-settings</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-scissors"></use>
</svg>
<div class="name">scissors</div>
<div class="fontclass">#icon-scissors</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-paperclip"></use>
</svg>
<div class="name">paperclip</div>
<div class="fontclass">#icon-paperclip</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-star"></use>
</svg>
<div class="name">star</div>
<div class="fontclass">#icon-star</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-reply-all"></use>
</svg>
<div class="name">reply-all</div>
<div class="fontclass">#icon-reply-all</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-toggle-filled"></use>
</svg>
<div class="name">toggle-filled</div>
<div class="fontclass">#icon-toggle-filled</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-trash-a"></use>
</svg>
<div class="name">trash-a</div>
<div class="fontclass">#icon-trash-a</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-trash-b"></use>
</svg>
<div class="name">trash-b</div>
<div class="fontclass">#icon-trash-b</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-wrench"></use>
</svg>
<div class="name">wrench</div>
<div class="fontclass">#icon-wrench</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-toggle"></use>
</svg>
<div class="name">toggle</div>
<div class="fontclass">#icon-toggle</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-custom-sort-down"></use>
</svg>
<div class="name">custom-sort-down</div>
<div class="fontclass">#icon-custom-sort-down</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-custom-sort"></use>
</svg>
<div class="name">custom-sort</div>
<div class="fontclass">#icon-custom-sort</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-custom-array-up"></use>
</svg>
<div class="name">custom-array-up</div>
<div class="fontclass">#icon-custom-array-up</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-custom-array"></use>
</svg>
<div class="name">custom-array</div>
<div class="fontclass">#icon-custom-array</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-custom-array-down"></use>
</svg>
<div class="name">custom-array-down</div>
<div class="fontclass">#icon-custom-array-down</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-custom-sort-up"></use>
</svg>
<div class="name">custom-sort-up</div>
<div class="fontclass">#icon-custom-sort-up</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-r"></use>
</svg>
<div class="name">arrow-r</div>
<div class="fontclass">#icon-arrow-r</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-l"></use>
</svg>
<div class="name">arrow-l</div>
<div class="fontclass">#icon-arrow-l</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-array-up"></use>
</svg>
<div class="name">array-up</div>
<div class="fontclass">#icon-array-up</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-array-down"></use>
</svg>
<div class="name">array-down</div>
<div class="fontclass">#icon-array-down</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-triangle-up"></use>
</svg>
<div class="name">triangle-up</div>
<div class="fontclass">#icon-triangle-up</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-triangle-down"></use>
</svg>
<div class="name">triangle-down</div>
<div class="fontclass">#icon-triangle-down</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-browse-colse"></use>
</svg>
<div class="name">browse-colse</div>
<div class="fontclass">#icon-browse-colse</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-arrow-drople"></use>
</svg>
<div class="name">android-arrow-drople</div>
<div class="fontclass">#icon-android-arrow-drople</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-arrow-dropdo"></use>
</svg>
<div class="name">android-arrow-dropdo</div>
<div class="fontclass">#icon-android-arrow-dropdo</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-arrow-dropri"></use>
</svg>
<div class="name">android-arrow-dropri</div>
<div class="fontclass">#icon-android-arrow-dropri</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-arrow-forwar"></use>
</svg>
<div class="name">android-arrow-forwar</div>
<div class="fontclass">#icon-android-arrow-forwar</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-checkbox-bla"></use>
</svg>
<div class="name">android-checkbox-bla</div>
<div class="fontclass">#icon-android-checkbox-bla</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-more-horizon"></use>
</svg>
<div class="name">android-more-horizon</div>
<div class="fontclass">#icon-android-more-horizon</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-notification"></use>
</svg>
<div class="name">android-notification</div>
<div class="fontclass">#icon-android-notification</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-radio-button"></use>
</svg>
<div class="name">android-radio-button</div>
<div class="fontclass">#icon-android-radio-button</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-remove-circl"></use>
</svg>
<div class="name">android-remove-circl</div>
<div class="fontclass">#icon-android-remove-circl</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-graph-down-rig"></use>
</svg>
<div class="name">arrow-graph-down-rig</div>
<div class="fontclass">#icon-arrow-graph-down-rig</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-phone-portra"></use>
</svg>
<div class="name">android-phone-portra</div>
<div class="fontclass">#icon-android-phone-portra</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrowdownb"></use>
</svg>
<div class="name">arrowdownb</div>
<div class="fontclass">#icon-arrowdownb</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-batteryhalf"></use>
</svg>
<div class="name">batteryhalf</div>
<div class="fontclass">#icon-batteryhalf</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-resize"></use>
</svg>
<div class="name">arrow-resize1</div>
<div class="fontclass">#icon-arrow-resize</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-batteryfull"></use>
</svg>
<div class="name">batteryfull</div>
<div class="fontclass">#icon-batteryfull</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-bluetooth"></use>
</svg>
<div class="name">bluetooth</div>
<div class="fontclass">#icon-bluetooth</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-camera1"></use>
</svg>
<div class="name">camera1</div>
<div class="fontclass">#icon-camera1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-chatboxes"></use>
</svg>
<div class="name">chatboxes</div>
<div class="fontclass">#icon-chatboxes</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-close1"></use>
</svg>
<div class="name">close1</div>
<div class="fontclass">#icon-close1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-custome-rservice"></use>
</svg>
<div class="name">custome-rservice</div>
<div class="fontclass">#icon-custome-rservice</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-clock1"></use>
</svg>
<div class="name">clock1</div>
<div class="fontclass">#icon-clock1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-arrow-graph-down-lef"></use>
</svg>
<div class="name">arrow-graph-down-lef</div>
<div class="fontclass">#icon-arrow-graph-down-lef</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-document1"></use>
</svg>
<div class="name">document1</div>
<div class="fontclass">#icon-document1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-flag1"></use>
</svg>
<div class="name">flag1</div>
<div class="fontclass">#icon-flag1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-help1"></use>
</svg>
<div class="name">help1</div>
<div class="fontclass">#icon-help1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-chatbubble-outli"></use>
</svg>
<div class="name">ios-chatbubble-outli</div>
<div class="fontclass">#icon-ios-chatbubble-outli</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-cloud-upload-out"></use>
</svg>
<div class="name">ios-cloud-upload-out</div>
<div class="fontclass">#icon-ios-cloud-upload-out</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-game-controller-"></use>
</svg>
<div class="name">ios-game-controller-</div>
<div class="fontclass">#icon-ios-game-controller-</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-reverse-camera-o"></use>
</svg>
<div class="name">ios-reverse-camera-o</div>
<div class="fontclass">#icon-ios-reverse-camera-o</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-skipbackward"></use>
</svg>
<div class="name">ios-skipbackward</div>
<div class="fontclass">#icon-ios-skipbackward</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-grid-view-outlin"></use>
</svg>
<div class="name">ios-grid-view-outlin</div>
<div class="fontclass">#icon-ios-grid-view-outlin</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-checkmark-ci"></use>
</svg>
<div class="name">android-checkmark-ci</div>
<div class="fontclass">#icon-android-checkmark-ci</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-skipbackward-out"></use>
</svg>
<div class="name">ios-skipbackward-out</div>
<div class="fontclass">#icon-ios-skipbackward-out</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-load-a"></use>
</svg>
<div class="name">load-a</div>
<div class="fontclass">#icon-load-a</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-stopwatch-outlin"></use>
</svg>
<div class="name">ios-stopwatch-outlin</div>
<div class="fontclass">#icon-ios-stopwatch-outlin</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-speedometer-outl"></use>
</svg>
<div class="name">ios-speedometer-outl</div>
<div class="fontclass">#icon-ios-speedometer-outl</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-skipforward"></use>
</svg>
<div class="name">ios-skipforward</div>
<div class="fontclass">#icon-ios-skipforward</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-load-d"></use>
</svg>
<div class="name">load-d</div>
<div class="fontclass">#icon-load-d</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-time-outline"></use>
</svg>
<div class="name">ios-time-outline</div>
<div class="fontclass">#icon-ios-time-outline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-locked"></use>
</svg>
<div class="name">locked</div>
<div class="fontclass">#icon-locked</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-model-s"></use>
</svg>
<div class="name">model-s</div>
<div class="fontclass">#icon-model-s</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-play1"></use>
</svg>
<div class="name">play1</div>
<div class="fontclass">#icon-play1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-location"></use>
</svg>
<div class="name">location</div>
<div class="fontclass">#icon-location</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-more1"></use>
</svg>
<div class="name">more1</div>
<div class="fontclass">#icon-more1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-qianniu"></use>
</svg>
<div class="name">qianniu</div>
<div class="fontclass">#icon-qianniu</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-publishgoods_fill"></use>
</svg>
<div class="name">publishgoods_fill</div>
<div class="fontclass">#icon-publishgoods_fill</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-prompt1"></use>
</svg>
<div class="name">prompt1</div>
<div class="fontclass">#icon-prompt1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-search1"></use>
</svg>
<div class="name">search1</div>
<div class="fontclass">#icon-search1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-refresh1"></use>
</svg>
<div class="name">refresh1</div>
<div class="fontclass">#icon-refresh1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-share1"></use>
</svg>
<div class="name">share1</div>
<div class="fontclass">#icon-share1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-bitcoin-outli"></use>
</svg>
<div class="name">social-bitcoin-outli</div>
<div class="fontclass">#icon-social-bitcoin-outli</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-socialgoogle"></use>
</svg>
<div class="name">socialgoogle</div>
<div class="fontclass">#icon-socialgoogle</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-social-tumblr"></use>
</svg>
<div class="name">social-tumblr</div>
<div class="fontclass">#icon-social-tumblr</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-socialt-witch-outlin"></use>
</svg>
<div class="name">socialt-witch-outlin</div>
<div class="fontclass">#icon-socialt-witch-outlin</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-wangwang"></use>
</svg>
<div class="name">wangwang</div>
<div class="fontclass">#icon-wangwang</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-success1"></use>
</svg>
<div class="name">success1</div>
<div class="fontclass">#icon-success1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-wifiicon"></use>
</svg>
<div class="name">wifiicon</div>
<div class="fontclass">#icon-wifiicon</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-view"></use>
</svg>
<div class="name">view</div>
<div class="fontclass">#icon-view</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-transgender"></use>
</svg>
<div class="name">transgender</div>
<div class="fontclass">#icon-transgender</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-arrow-dropdo1"></use>
</svg>
<div class="name">android-arrow-dropdo1</div>
<div class="fontclass">#icon-android-arrow-dropdo1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-arrow-dropup1"></use>
</svg>
<div class="name">android-arrow-dropup1</div>
<div class="fontclass">#icon-android-arrow-dropup1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-arrow-drople1"></use>
</svg>
<div class="name">android-arrow-drople1</div>
<div class="fontclass">#icon-android-arrow-drople1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-notification1"></use>
</svg>
<div class="name">android-notification1</div>
<div class="fontclass">#icon-android-notification1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-arrow-dropri1"></use>
</svg>
<div class="name">android-arrow-dropri1</div>
<div class="fontclass">#icon-android-arrow-dropri1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-android-radio-button1"></use>
</svg>
<div class="name">android-radio-button1</div>
<div class="fontclass">#icon-android-radio-button1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-forkrepo"></use>
</svg>
<div class="name">forkrepo</div>
<div class="fontclass">#icon-forkrepo</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-game-controller-1"></use>
</svg>
<div class="name">ios-game-controller-1</div>
<div class="fontclass">#icon-ios-game-controller-1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-ios-game-controller-2"></use>
</svg>
<div class="name">ios-game-controller-2</div>
<div class="fontclass">#icon-ios-game-controller-2</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-doublearrow"></use>
</svg>
<div class="name">double arrow</div>
<div class="fontclass">#icon-doublearrow</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-goBottom-square"></use>
</svg>
<div class="name">goBottom-square</div>
<div class="fontclass">#icon-goBottom-square</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-backTop-square"></use>
</svg>
<div class="name">backTop-square</div>
<div class="fontclass">#icon-backTop-square</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-document-file"></use>
</svg>
<div class="name">document-file</div>
<div class="fontclass">#icon-document-file</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-upload1"></use>
</svg>
<div class="name">upload</div>
<div class="fontclass">#icon-upload1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-fresh"></use>
</svg>
<div class="name">fresh</div>
<div class="fontclass">#icon-fresh</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-backTop-round"></use>
</svg>
<div class="name">backTop-round</div>
<div class="fontclass">#icon-backTop-round</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-goBottom-round1"></use>
</svg>
<div class="name">goBottom-round</div>
<div class="fontclass">#icon-goBottom-round1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-bells"></use>
</svg>
<div class="name">t-b-bells</div>
<div class="fontclass">#icon-t-b-bells</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-skin"></use>
</svg>
<div class="name">t-b-skin </div>
<div class="fontclass">#icon-t-b-skin</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-personal"></use>
</svg>
<div class="name">t-b-personal</div>
<div class="fontclass">#icon-t-b-personal</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-lockscreen"></use>
</svg>
<div class="name">t-b-lockscreen</div>
<div class="fontclass">#icon-t-b-lockscreen</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-setting"></use>
</svg>
<div class="name">t-b-setting</div>
<div class="fontclass">#icon-t-b-setting</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-moveup"></use>
</svg>
<div class="name">t-b-moveup</div>
<div class="fontclass">#icon-t-b-moveup</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-movedown"></use>
</svg>
<div class="name">t-b-movedown</div>
<div class="fontclass">#icon-t-b-movedown</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-unfoldingaround"></use>
</svg>
<div class="name">t-b-unfoldingaround</div>
<div class="fontclass">#icon-t-b-unfoldingaround</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-roundup"></use>
</svg>
<div class="name">t-b-roundup</div>
<div class="fontclass">#icon-t-b-roundup</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-organizationexpa"></use>
</svg>
<div class="name">t-b-organizationexpa</div>
<div class="fontclass">#icon-t-b-organizationexpa</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-organizationreco"></use>
</svg>
<div class="name">t-b-organizationreco</div>
<div class="fontclass">#icon-t-b-organizationreco</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-rightexpansion"></use>
</svg>
<div class="name">t-b-rightexpansion</div>
<div class="fontclass">#icon-t-b-rightexpansion</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-leftside"></use>
</svg>
<div class="name">t-b-leftside</div>
<div class="fontclass">#icon-t-b-leftside</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-close"></use>
</svg>
<div class="name">t-b-close</div>
<div class="fontclass">#icon-t-b-close</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-required"></use>
</svg>
<div class="name">t-b-required</div>
<div class="fontclass">#icon-t-b-required</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-message"></use>
</svg>
<div class="name">t-b-message</div>
<div class="fontclass">#icon-t-b-message</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-down"></use>
</svg>
<div class="name">t-b-down</div>
<div class="fontclass">#icon-t-b-down</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-system"></use>
</svg>
<div class="name">t-b-system</div>
<div class="fontclass">#icon-t-b-system</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-userallocation"></use>
</svg>
<div class="name">t-b-userallocation</div>
<div class="fontclass">#icon-t-b-userallocation</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-activation"></use>
</svg>
<div class="name">t-b-activation</div>
<div class="fontclass">#icon-t-b-activation</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-download"></use>
</svg>
<div class="name">t-b-download</div>
<div class="fontclass">#icon-t-b-download</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-cancellation"></use>
</svg>
<div class="name">t-b-cancellation</div>
<div class="fontclass">#icon-t-b-cancellation</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-lookup"></use>
</svg>
<div class="name">t-b-lookup</div>
<div class="fontclass">#icon-t-b-lookup</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-modify"></use>
</svg>
<div class="name">t-b-modify</div>
<div class="fontclass">#icon-t-b-modify</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-new"></use>
</svg>
<div class="name">t-b-new</div>
<div class="fontclass">#icon-t-b-new</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-passwordreset"></use>
</svg>
<div class="name">t-b-passwordreset</div>
<div class="fontclass">#icon-t-b-passwordreset</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-delete"></use>
</svg>
<div class="name">t-b-delete</div>
<div class="fontclass">#icon-t-b-delete</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-unlock"></use>
</svg>
<div class="name">t-b-unlock</div>
<div class="fontclass">#icon-t-b-unlock</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-locking"></use>
</svg>
<div class="name">t-b-locking</div>
<div class="fontclass">#icon-t-b-locking</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-jurisdiction"></use>
</svg>
<div class="name">t-b-jurisdiction</div>
<div class="fontclass">#icon-t-b-jurisdiction</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-post"></use>
</svg>
<div class="name">t-b-post</div>
<div class="fontclass">#icon-t-b-post</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-roleauthorizatio"></use>
</svg>
<div class="name">t-b-roleauthorizatio</div>
<div class="fontclass">#icon-t-b-roleauthorizatio</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-distribution"></use>
</svg>
<div class="name">t-b-distribution</div>
<div class="fontclass">#icon-t-b-distribution</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-abolitiondistrib"></use>
</svg>
<div class="name">t-b-abolitiondistrib</div>
<div class="fontclass">#icon-t-b-abolitiondistrib</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-organization"></use>
</svg>
<div class="name">t-b-organization</div>
<div class="fontclass">#icon-t-b-organization</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-role"></use>
</svg>
<div class="name">t-b-role</div>
<div class="fontclass">#icon-t-b-role</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-batchrefresh"></use>
</svg>
<div class="name">t-b-batchrefresh</div>
<div class="fontclass">#icon-t-b-batchrefresh</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-time"></use>
</svg>
<div class="name">t-b-time</div>
<div class="fontclass">#icon-t-b-time</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-date"></use>
</svg>
<div class="name">t-b-date</div>
<div class="fontclass">#icon-t-b-date</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-singlerefresh"></use>
</svg>
<div class="name">t-b-singlerefresh</div>
<div class="fontclass">#icon-t-b-singlerefresh</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-Warning"></use>
</svg>
<div class="name">t-b-Warning</div>
<div class="fontclass">#icon-t-b-Warning</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-correctinformati"></use>
</svg>
<div class="name">t-b-correctinformati</div>
<div class="fontclass">#icon-t-b-correctinformati</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-sendout"></use>
</svg>
<div class="name">t-b-send out</div>
<div class="fontclass">#icon-t-b-sendout</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-return"></use>
</svg>
<div class="name">t-b-return</div>
<div class="fontclass">#icon-t-b-return</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-forward"></use>
</svg>
<div class="name">t-b-forward</div>
<div class="fontclass">#icon-t-b-forward</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-reply"></use>
</svg>
<div class="name">t-b-reply</div>
<div class="fontclass">#icon-t-b-reply</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-playon"></use>
</svg>
<div class="name">t-b-playon</div>
<div class="fontclass">#icon-t-b-playon</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-offline"></use>
</svg>
<div class="name">t-b-offline</div>
<div class="fontclass">#icon-t-b-offline</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-permissioncopy"></use>
</svg>
<div class="name">t-b-permissioncopy</div>
<div class="fontclass">#icon-t-b-permissioncopy</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-permissiondownlo"></use>
</svg>
<div class="name">t-b-permissiondownlo</div>
<div class="fontclass">#icon-t-b-permissiondownlo</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-addto"></use>
</svg>
<div class="name">t-b-addto</div>
<div class="fontclass">#icon-t-b-addto</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-newlybuild"></use>
</svg>
<div class="name">t-b-newlybuild</div>
<div class="fontclass">#icon-t-b-newlybuild</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-organizational"></use>
</svg>
<div class="name">t-b-organizational</div>
<div class="fontclass">#icon-t-b-organizational</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-tree"></use>
</svg>
<div class="name">t-b-tree</div>
<div class="fontclass">#icon-t-b-tree</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-verification"></use>
</svg>
<div class="name">t-b-verification</div>
<div class="fontclass">#icon-t-b-verification</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-tips"></use>
</svg>
<div class="name">t-b-tips</div>
<div class="fontclass">#icon-t-b-tips</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-password"></use>
</svg>
<div class="name">t-b-password</div>
<div class="fontclass">#icon-t-b-password</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-phone"></use>
</svg>
<div class="name">t-b-phone</div>
<div class="fontclass">#icon-t-b-phone</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-account"></use>
</svg>
<div class="name">t-b-account</div>
<div class="fontclass">#icon-t-b-account</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-max"></use>
</svg>
<div class="name">max</div>
<div class="fontclass">#icon-max</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-min"></use>
</svg>
<div class="name">min</div>
<div class="fontclass">#icon-min</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-add"></use>
</svg>
<div class="name">t-b-add</div>
<div class="fontclass">#icon-t-b-add</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-t-b-minus"></use>
</svg>
<div class="name">t-b-minus</div>
<div class="fontclass">#icon-t-b-minus</div>
</li>
</ul>
<h2 id="symbol-">symbol引用</h2>
<hr>
<p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
这种用法其实是做了一个svg的集合，与另外两种相比具有如下特点：</p>
<ul>
<li>支持多色图标了，不再受单色限制。</li>
<li>通过一些技巧，支持像字体那样，通过<code>font-size</code>,<code>color</code>来调整样式。</li>
<li>兼容性较差，支持 ie9+,及现代浏览器。</li>
<li>浏览器渲染svg的性能一般，还不如png。</li>
</ul>
<p>使用步骤如下：</p>
<h3 id="-symbol-">第一步：引入项目下面生成的symbol代码：</h3>
<pre><code class="lang-js hljs javascript"><span class="hljs-comment"><script src="./iconfont.js"></script></span></code></pre>
<h3 id="-css-">第二步：加入通用css代码（引入一次就行）：</h3>
<pre><code class="lang-js hljs javascript"><style type=<span class="hljs-string">"text/css"</span>>
.icon {
width: <span class="hljs-number">1</span>em; height: <span class="hljs-number">1</span>em;
vertical-align: <span class="hljs-number">-0.15</span>em;
fill: currentColor;
overflow: hidden;
}
<<span class="hljs-regexp">/style></span></code></pre>
<h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="lang-js hljs javascript"><svg <span class="hljs-class"><span class="hljs-keyword">class</span></span>=<span class="hljs-string">"icon"</span> aria-hidden=<span class="hljs-string">"true"</span>><span class="xml"><span class="hljs-tag">
<<span class="hljs-name">use</span> <span class="hljs-attr">xlink:href</span>=<span class="hljs-string">"#icon-xxx"</span>></span><span class="hljs-tag"></<span class="hljs-name">use</span>></span>
</span><<span class="hljs-regexp">/svg>
</span></code></pre>
</div>
</body>
</html>