一些额外且好用的 icon 图库

一些额外且好用的 icon 图库

之前偶然逛到 最佳 Icon 图标库推荐，收藏等于学会，这个真的挺好用的，不过这里的 icon 都是和 React 组件绑定了，额外补充一些不和框架绑定的图库

font awesome

这个应该用的人满多的，算是把 icon 当成 font 用，引入 CDN 的话，直接在 html/css 里面也可以使用，地址为：https://fontawesome.com/

使用 font awesome 要注意一下版本，5 和 6 的图库和使用差挺多的，比如说 5 会使用 fa fas 这种类去添加样式，6 就移除了

免费版有两千多个图标，应对正常的使用差不多是够了的，付费版有 2w6，这个看具体需求了

icomoon

网址为：https://icomoon.io/#home，这个用的也挺多的，而且可以单独选择 icon，生成对应的字体文件（ttf），随后通过 CSS 的 @font-face 导入使用

找 library 可以通过这个网址进入：https://icomoon.io/app/#/select/library，它们的导航也没很友好，目前有的 packages 如下：

有个需要注意的就是使用的 License，虽然不少部分都是署名可免费商用，不过还是要注意一下

阿里矢量图库

网址 https://www.iconfont.cn/，我觉得这个知道的应该蛮多的吧，一般来说这里每个 font 都有一个 set，也是可以根据整个 set 下载，不过我一般都找单独的 icon 用，现在做的脸插画都有了……

如果要用在项目里的话，优势在于你想找的什么都有，缺点在于有些很好看的风格太过独特，不一定很好搭配，如：

有些集成的用起来就很方便：

不过需要注意，icons 商用前一定要问版权和收费问题

iconfinder

网址：https://www.iconfinder.com/

它其实有一些已经配好成套的 icon 可以使用：

另外网站上宣称是有六百万个 icons，应该可以满足不少的需求

这个网址也包括了一些 3d、贴纸设计等，有需求的可以找一下有没有看得上的 icons

不过比较有趣的图库很大可能是付费使用的：

flaticon

网址：https://www.flaticon.com，我看了一下这里大部分使用都是署名就可以免费使用（包括商用），它的一些 icon 更具有特色，如：

并且还有动图：

Atom animated icons created by Freepik - Flaticon

这个主要的问题也是一样，成套比较苦难，而且找到满意的 icon 之后，再寻找适配的风格也会比较的苦难。加上普通图免费版本只有 png，动图的格式免费版的只有 gif/mp4/png，虽然格式倒是很多：

thenounproject

这是最后一个，网址为https://thenounproject.com/，它所有的 icon 都是需要著权使用，免费版只能下载无法修改的版本。不过我觉得它的 icon 倒是都挺有特色的：

补充

最近在看思维导图的内容，然后发现其实这些矢量图库真的蛮好用的，比如说：

这几个列举的 icon 都能比较轻松的代替 function/method 这种，之前可能还真的没想到用 这个颜文字代替 编程/函数/方程，还有 mindmap：

这两个（第一和第三）应该是我看到最简单，最好画，并且一眼就能够联想到思维导图的 icon（特别是第三个）

对比下来，如果是简笔画，那么优先找 thenounproject，如果需要图，可以是 cv 的，可以看看 iconfinder，阿里的关键字会稍微有点差，但是也能找到相关联的内容。

当然，如果知道 tech 或者中文的关键字，权重为阿里 > iconfinder > thenounproject。最后一个 tech 方面的 icon 挺少的，比如说关于 vue 的搜索：

我又试着找了一下 spring，另外两个网站基本都是春天、花朵、弹簧这种，阿里的至少给了个 spring-boot 的灰色 icon。搜索 spring boot，阿里 和 iconfinder 都给了一个结果，thenounproject 则是全都和靴子相关

总归说如果是几个网站结合一下，基本上想找的内容差不多都能找到了