# 如何把阿里图标库的图标生成代码并应用于自己的项目
[iconfont - 阿里巴巴失量图标库](https://links.jianshu.com/go?to=https%3A%2F%2Fwww.iconfont.cn%2Fhome%2Findex%3Fspm%3Da313x.7781069.1998910419.2)
有时候需要用很多图标去完成一定的页面效果和工作展现,框架内置的图标可能满足不了我们的需求,有个很好的图标库想必大家都知道-----就是阿里图标库。那么我们如何才能够把阿狸图标库的图标引用到自己的项目中呢?耐着性子往下看吧!
阿里图标库地址:[https://www.iconfont.cn/](https://links.jianshu.com/go?to=https%3A%2F%2Fwww.iconfont.cn%2F)
1.根据所需搜索到想要的图标,鼠标悬停,点击添加到购物车
![](https://upload-images.jianshu.io/upload_images/15619090-1fa5f483e35e8066.png?imageMogr2/auto-orient/strip|imageView2/2/w/1200/format/webp)
![1.png](https://img.kancloud.cn/61/9a/619aca26b1e5a9cebb1ca05671d72bf5_1200x569.png)
2.点击购物车
![](https://img.kancloud.cn/83/c5/83c5420ca573db93c6d5ea7575845df5_1200x829.png)
3.点击添加至项目
![](https://img.kancloud.cn/23/61/2361342fa9a19cf592f894b5ab06cb06_619x798.png)
4.选择添加到一个项目里面,点击确定
![](https://img.kancloud.cn/9e/db/9edb2eaf921125781839dea62ea87bff_330x618.png)
5.点击font class 的选项,可以看到你添加过的图标,下面的英文对应的是图标代码,点击下载至本地。
![](https://img.kancloud.cn/9a/8a/9a8a5362c75e52adad051e381a84cb2c_1200x564.png)
- 视觉规范
- 色彩
- 文字
- 偏移
- 图标
- 列表组件
- 表单组件
- 详情组件
- 其他组件
- 研发规范
- 编码规范
- 函数式编程
- 纯函数
- 柯里化
- 函数组合
- 函子
- 面向对象编程
- 设计原则
- 单一职责原则
- 里氏替换原则
- 依赖倒置原则
- 接口隔离原则
- 开闭原则
- 迪米特原则
- 组合复用原则
- 设计模式
- 创建型模式
- 工厂模式
- 简单工厂
- 工厂方法
- 抽象工厂
- 单例模式
- 建造者模式
- 原型模式
- 结构型模式
- 适配器模式
- 桥接模式
- 过滤器模式
- 组合模式
- 装饰器模式
- 外观模式
- 享元模式
- 代理模式
- 行为型模式
- 责任链模式
- 命令模式
- 解释器模式
- 迭代器模式
- 中介者模式
- 备忘录模式
- 观察者模式
- 状态模式
- 策略模式
- 模板模式
- 访问者模式
- 组件设计规范
- 组件文档编写规范
- 版本管理规范