阿里云图标库官网：www.iconfont.cn 一、首先登录阿里巴巴矢量图标库 阿里巴巴矢量图标库
目前只支持GitHub 和新浪微博账号授权登录。
新功能：彩色图标设置方法，看下图（注意：阿里限制一个彩色项目最多20个图标）
阿里云图标的使用方法
二、新建图标库项目
登录后，点击上面菜单中的图标管理→我的项目，点新建项目图标新建一个图标项目：
阿里云图标的使用方法
在弹出的窗口中输入相关信息，项目名称任意。
需要注意（设置后不显示基本都是下面这步错了）：☟☟☟
FontClass/Symbol 前缀输入：io-，Font Family 输入：io，前后不能有空格。如图：注意前缀加中横线（仔细对照下图）
阿里云图标的使用方法 三、向图标项目中添加图标 点击菜单上的图标库，进入一个图标库。
用鼠标选择一个图标并点击上面的购物车图标，将图标添加到临购物车中，如图：
阿里云图标的使用方法 已添加过的图标，会有个虚线框提示，右上角购物车图标上的数字，是在购物车中待添加到项目中的图标个数。
选择添加完图标，点击右上角的购物车图标，将添加在购物车中的图标添加到相应该项目中：
阿里云图标的使用方法
点击生成代码：(以后每次添加新图标都要重新生成代码)
阿里云图标的使用方法
四、加载外链图标字体库
复制代码：
后台填写：
阿里云图标的使用方法
五、给菜单项目添加图标字体
返回已建好的图标字体库页面，用鼠标复制图标代码，例如：io-zhuti
阿里云图标的使用方法
其中Unicode(16进制)代码，比如下图这个图标的Unicode代码 e636，就与主题默认的新浪微博的图标相同随便改一个，但必须是字母e开头6以后的数字四个数字和字母组合，如图：
阿里云图标的使用方法 不要把胡乱地把一些图标都弄到字库中项目中，使用哪个就添加哪个，不然会引起更多的字体名称冲突，而且会在一定程度上影响加载速度。
本导航系统阿里云图标加载与运行逻辑：
读取阿里云项目库的样式地址中的内容，然后实时渲染，但是你更新新图标后，阿里云那边需要手动更新，并且链接也需要更新一下。下面是彩色图标的开启方式，不开默认是黑白的 而且阿里云的项目是限制彩色图标的数量的：
开启并保存即可。
