icon阿里矢量图标库，高质量素材随取随用

可通过在线引入、本地部署字体包、Symbol嵌入SVG或第三方工具管理四种方式获取并使用阿里矢量图标库中的图标资源。

如果您在使用网页或应用程序时发现图标无法正常显示，或者需要为项目添加高质量的矢量图标资源，可能是由于本地图标素材缺失或格式不兼容。以下是获取并使用阿里矢量图标库中高质量图标的几种方式：

本文运行环境：MacBook Pro，macOS Sonoma

一、通过在线链接直接引入图标

利用阿里矢量图标库提供的在线字体文件链接，可以直接将图标嵌入网页中，无需下载任何资源。

1、访问阿里矢量图标库官网，登录账号后进入“我的项目”页面。

2、创建一个新的图标项目，并将所需图标添加至该项目中。

3、生成在线引用链接，复制提供的 标签代码。

4、将复制的代码插入到 HTML 文件的 区域内。

5、在需要显示图标的元素中使用对应的 class 名称，例如：iconfont icon-xxx。

二、下载图标字体包本地部署

为了提升加载速度和保障资源稳定性，可将图标字体文件下载并在本地服务器中部署。

1、在图标项目页面点击“下载至本地”按钮，获取包含所有字体文件的压缩包。

2、解压文件并将 .woff、.ttf、.svg 等字体文件放置于项目的 assets/fonts 目录下。

3、修改 project.css 或自定义样式文件中的字体路径，确保 url() 指向正确的本地位置。

4、将 CSS 文件引入网页头部，然后通过指定类名调用图标。

5、检查浏览器控制台是否出现 404 错误，确认所有资源均已正确加载。

三、使用 Symbol 方式嵌入 SVG 图标

Symbol 模式支持使用 SVG 的 标签调用图标，具备良好的可维护性和样式控制能力。

1、在项目设置中选择“Symbol”引用方式，并复制生成的 JavaScript 脚本地址。

2、将脚本通过