Flaticon:图标种类多到挑花眼
做PPT、写文档、搭网页,总少不了用图标点缀。Flaticon 是很多人第一反应想到的开源图标库,收录了数百万个SVG和PNG格式的图标,分类清晰,搜索方便。比如你要做个环保主题的演示,搜“树叶”“回收”,立马跳出几十种样式。
大部分图标遵循CC BY 3.0协议,只要署名就能免费商用。下载时勾选“Include attribution”,系统会自动生成使用声明,省心不少。
Font Awesome(开源版本):前端开发的好搭档
如果你在写网页,Font Awesome 的开源版是绕不开的选择。它把图标做成字体,一行代码就能引入,大小颜色随CSS控制,特别灵活。
<i class="fas fa-home"></i>这行代码就能显示一个主页图标。开源版本包含超2000个常用图标,够日常项目用了。官网有详细文档,连Bootstrap都常拿它搭配使用。
注意区分免费与Pro版本
Font Awesome 官网现在主推付费Pro版,但GitHub上仍维护着完整的开源分支。认准 fontawesome-free 这个包名,用npm安装也不费劲:
npm install @fortawesome/fontawesome-freeIconPark:字节跳动出品,风格统一又现代
国内开发者可能更熟悉 IconPark,这是字节推出的开源图标库,风格偏线性扁平,适合中后台系统或移动端界面。它支持按主题切换填充或描边样式,还能在线调整图标的圆角、粗细等细节。
项目基于React和Vue都有封装,直接当组件引入。比如在Vue里这样用:
<template>
<icon name="add" />
</template>它还提供Figma插件,设计师和开发交接时少了不少扯皮。
Tabler Icons:简洁有力,适合技术类项目
这个图标库走极简路线,线条干净,命名逻辑清晰。像“user-edit”“file-search”这类组合词一看就懂,找图标不靠猜。总共600多个,数量不算最多,但质量稳定。
所有图标都是MIT协议,随便用不用署名。GitHub仓库更新频繁,社区也常贡献新设计。你可以在官网一键下载整套SVG,也能复制单个代码嵌入页面。
实用小技巧:本地预览再下载
别一上来就批量下载。建议先在官网用关键词试搜,比如“设置”“消息”“图表”,看看风格是否和你的项目匹配。风格不统一的图标混在一起,反而显得杂乱。
有些库支持导出为React组件或CSS类名,提前选好格式能省去后期转换的麻烦。