做网站最头疼的不是写代码，而是没图、没图标、没配色灵感。尤其当你熬夜赶项目，打开设计工具却不知道从哪下手时，一堆现成的开源设计资源能救你一命。
免费可商用的素材才靠谱
很多人图方便直接百度搜图，结果上线没多久就收到侵权通知。真正省心的，是那些明确标注 CC0 或 MIT 协议的开源资源站。它们不仅免费，还能用在商业项目里，不用担心法律风险。
推荐几个高频使用的站点
Undraw 是我常去的地方，里面全是高质量的 SVG 插画，风格统一，颜色还能自定义。比如做个用户注册页，直接搜 "signup" 就能挑一张合适的插图嵌进去。
<img src="https://undraw.co/illustrations/signup.svg" alt="注册插图">Feather Icons 提供了一套简洁的矢量图标，全部开源，用起来特别轻快。一个 CDN 链接引入，就能在页面里直接用。
<script src="https://unpkg.com/feather-icons"></script>
<i data-feather="home"></i>
<script>feather.replace();</script>如果你在找配色方案，Coolors 虽然不算传统意义上的“开源”，但它生成的调色板可以自由使用，配合开源项目一起出设计稿很顺手。按一下空格就能随机出一组协调的颜色，适合犹豫症患者。
还有像 Open Peeps 这种手绘风人物插画库，所有素材都是 SVG 格式，能随意组合发型、姿势、表情，适合做引导页或说明图。
怎么把资源用进自己的项目
别一股脑全下下来扔进 assets 文件夹。建议先分类：图标放 icons 目录，插图画放 illustrations，配色方案记在文档里。这样下次接手的人也好维护。
遇到需要修改 SVG 的情况，比如想改个颜色或删掉某部分元素，直接用代码编辑器打开就行。不像 PSD 动不动就打不开，SVG 本质是文本，干净又灵活。
有些团队喜欢自己建内部资源库，其实就是把常用的几个开源站点整理成链接表，新成员入职第一件事就是收藏这份清单。省得每次都要重新搜索。