IcoMoon

IcoMoon是什么？

IcoMoon是一个专注于提供矢量图标字体生成与管理的在线工具平台。能让我们根据自己的需求选取不同自定义图标或大量的可利用免费矢量图标库来创建自己想要的图标字体以及CSS精灵，使你在应用在项目的 Web 或移动端上更容易实现多样的图标展示。

主要功能

1.图标字体生成

• 直接点击 IcoMoon 自带的免费/收费图标库（5500+ 矢量图标），或者自定义上传 SVG 格式的图标制作字体图标文件（.ttf .woff …）。
• 支持批量生成图标字体，并自动生成配套的CSS样式文件，简化引用流程。

2.图标管理与定制

• 创建和管理多个项目与图标集合，并支持导入 / 导出图标集（例如，通过 selection.json 进行导出设置）。
• 可调整图标的编码（Unicode值）、类名（CSS类）、字体名称等参数，避免命名冲突。

3. 多格式输出：除了字体文件以外，还能输出 SVG、PNG 格式的图标文件。

使用场景

1.网页开发

• 把自动生成的 style.css 和字体文件放在一起，只需要用类名 就可以快速找到图标。
• 在Vue等前端框架中，可将字体文件置于静态目录以避免Webpack打包问题。

2. 自定义图标加入：设计师可以轻松将 SVG 图标制作成自己喜欢的字体，不用担心图标的风格问题；

3. 个性化的图标库：为某个项目持续维护图标集。

使用方法

第一步、添加或者上传图标：打开 IcoMoon App 界面，ICOmoon 自带图标和 Import Icons 图标上传 SVG 格式的图标。

第二步、制作字体文件：选择图标点击 Generate Font 预览之后制作出来，修改参数点击下载压缩包。

第三步、添加到项目里面解压导入 fonts 文件和 style.css ，引入样式对应类名即可。