工欲善其事必先利其器，优秀的素材网站为产品设计师、UI/UX设计师带来设计灵感，简化前端工程师的开发时间，以及为用户提供更好的使用体验。一个漂亮的用户界面、一组吸引眼球的图片、或一个平衡的调色板可以极大的提高用户粘度，也是一个优秀产品的必备特质。
下面是我工作中常用的一些免费素材网站。我的这个列表不包括一些最流行的素材网站，比如Unsplash或者Shutterstock等。毕竟这些网站大家已经常使用了。
-照片与视频（上篇）
-插图（上篇）
-调色板（上篇）
-字体设计（上篇）
-动画效果（下篇）
-图标（下篇）
-图案（下篇）
-其他工具（下篇）
照片与视频
Coverr
Coverr免费的视频素材网站，它几乎涵盖了各类视频素材
Mixkit
Mixkit包括大量的免费视频素材，音乐，声效，以及视频模板。
Pexels
Pexels是一个免费的照片素材网站，它时常为摄影师举办挑战比赛，你可以在上面发现很多意想不到的好素材。
Photo Creator
如果你找不到想要的人像素材，那你一定要试试Photo Creator。从选择模特，到挑选背景，再到放入装饰物品，Photo Creator可以帮助你创造自己的人像照片。
Unscreen
借用AI技术，Unscreen可以帮助你删除、替换视频、GIF中的背景。
Remove Background
与Unscreen类似，Remove Background可以帮助我们去除图片中的背景。
Generated Photos
Generate Photos是一款非常好用的人像照片生成工具。
Duotone
Duotone可以将任何图片转换为双色调风格。
插图
Open Peeps
Open Peeps是一个提供免费的100%手绘插画素材。
Smash Illustrations
另一个有意思的免费插画素材网站。
Open Doodles
一款免费的插图素材网站。
Control
Control为我们提供了108组不同主题的插画素材。
Ouch!
Ouch为设计师提供了大量的免费插画素材。
Avataaars Generator
Avataaars Generator帮助我们生成各类有意思的卡通用户头像。
Faux Code Generator
Faux Code Generator可以把代码转换成SVG矢量图片。
调色板
Parametric Color Mixer
一个类似声音均衡器的调色板工具。
CSS Gradient
强烈推荐的一款CSS渐变代码生成器。
Colorsinspo
Colorsinspo拥有上千种颜色组合。
Color Hexa
ColorHexa可以为任何一个颜色生成相匹配的色调组合。
Color Space
Color Space可以为你的项目生成漂亮的调色板、渐变和匹配的配色方案!
Palettte App
Palettte App为我们创建、分析和编辑平滑的调色板。
Colorable
Colorable是一个颜色组合测试应用，它可以将我们的颜色方案实时展现在一个网站上。
字体设计
Freebiesbug
Freebiesbug提供免费的英文字体以及文件。
Fonts Arena
免费字体，很好的英文字体素材网站。
Befonts
同样是一个免费字体网站，专注于各类艺术字、花体字。
Fontjoy
Fontjoy可以让设计师轻松匹配不同的字体，并实时展示在网站上。
下篇文章，我将为大家带来一些使用的动效、图标、图案等免费素材库。
浏览下篇文章可点击 ：未定义变量：50个设计师/前端工程师必备的宝藏素材网站 - 下篇
--阅读更多文章，请关注我的公众号：未定义变量