自定义

QWeather Icons 项目可以帮助你创建自定义图标和图标字体。

各花入各眼，你可能希望修改图标的颜色，或者修改一些图标样式以更加适配你的设计风格，这里将介绍如何使用和风天气项目创建你的自定义图标和字体。

编辑图标和字体#

👉 在Figma中获取所有设计文件

你可以对这些图标修改颜色或调整样式，然后导出新的SVG或其他格式的图片。

如果需要创建新的字体，你必须：

当完成上述图标和字体的重新设计后，参考下方运行QWeather Icons，可以对SVG图标进行压缩和优化（我们使用SVGO）并创建字体。

运行 QWeather Icons#

QWeather Icons项目将帮助你优化SVG图标和创建新的字体。

1. 安装Node.js

请访问 https://nodejs.org 下载并安装Node.js，我们在v14和v18版本测试通过。

2. 下载项目

git clone https://github.com/qwd/Icons.git

3. 导入自定义SVG

将你修改后的所有SVG粘贴到/icons目录下并替换原文件。

如果有新增/删除/重命名的图标，你需要编辑icons-list.json文件。

4. 安装依赖

进入项目目录，安装依赖库（这可能会需要一些时间，取决于你的网络环境，或者尝试更改npm源）：

npm install

5. 运行

npm run icons

稍等片刻，所有SVG图标在/icons目录生成，字体文件在/font目录下生成，你也可以打开/font/demo.html查看效果。

搞定 🎉