设计师观点：为开发者提供免费矢量资源

作为一名从设计师转型为开发者的人，有些工具与设计师和开发者息息相关，需要时刻保持敏锐的洞察力。我发现的其中一种工具就是矢量图形。在网页设计和开发中，经常使用的矢量图形类型有很多，包括插图、图标，甚至动画。我按类别整理了这份清单，列出了我最喜欢的（通常是免费的）矢量图形资源。希望这份清单能为您的工具箱提供一些额外的工具，让您的设计和技能保持敏锐。

免费矢量图形网站（按类别）

插图

这些平台提供各种有趣且可定制的插图，或许能为您的项目提供帮助。它们可以用于启动页图片、主图，甚至 404 页面！

拉开

FreePik：故事

脸红

icons8：插图

模式库

图标

图标可用于 Web 应用程序中的各种用途，保持项目图标集的新鲜感非常重要。此列表为您提供了大量免费且易于自定义的图标，可供您在整个项目中使用。

Noun Project（也有精彩的照片选择）

Flaticon

英雄偶像

图标8

Font Awesome：备忘单

*荣誉提名（因为它是免费的！）：Shape.so

动画

动画在网页上的使用已经非常流行，可以用来提升风格和吸引注意力。我将留到以后再详细学习 JavaScript 动画框架，但会提供一系列免费资源，包括免费下载和插入预制动画（Lottie）、动画原型设计工具，以及在项目中何时以及如何使用动画的原则。

Lottie by AirBnb

LottieFiles：可搜索的 Lottie 动画

Framer：免费动画原型制作工具

Origami：免费动画原型制作工具

材料设计：理解运动

结论

拥有合适的工具箱，我们都能创作出更精美、更强大、更高效的作品。你的开发工具箱中应该包含的工具之一，就是用于查找精美且可自定义的矢量图形的资源。希望你能从上述资源中找到一些有价值的内容，并能够从中挑选出一些自己喜欢的资源，来完善你工具箱中这个有趣而重要的工具。