共计 1766 个字符，预计需要花费 5 分钟才能阅读完成。
这 18 个网站是我在取经路上意外发现的，外面包含 纯 CSS 实现的炫酷背景，还有专门制作背景图的网站。
算是取经路上的大补之物~
1. CSS3 Patterns Gallery
🎗️ 传送门：『CSS3 Patterns Gallery』
如果你意识 Lea Verou 的话，大概率晓得这个网站，她徒手写了几十个 纯 CSS 实现的背景图款式。
网站上提供了她的代码。
如果你不意识她，那我肯定要举荐你浏览一下《CSS 揭秘（图灵出品）》这本书，它会让你大受震撼！
2. CSS3 Gradients
🎗️ 传送门：『CSS3 Gradients』
除了 Lea Verou 的网站外，CSS3 Gradients 也提供了这类示例。同样提供代码下载。
3. CSS Gradients with background-blend-mode
🎗️ 传送门：『CSS Gradients with background-blend-mode』
性能和后面两个差不多，本人点开看看呗~
4. CSS Flags
🎗️ 传送门：『CSS Flags』
应用 纯 CSS 的形式画出多国国旗。“右键 – 查看网页源代码” 能够获取代码。
5. Hero Patterns
🎗️ 传送门：『Hero Patterns』
Hero Patterns 是比拟闻名网站了，官网提供了几十款纹理，你能够依据本人的需要设置两种对比色和不透明度。
实现后会返回一段 CSS 代码给你，不过和后面几个网站有点不同的是，Hero Patterns 的背景图应用了 base64 的形式去实现的，而不是 CSS 背景突变 的形式。
6. HUE.CSS
🎗️ 传送门：『HUE.CSS』
应用 CSS 背景突变 的形式做出的数十款高端大气的背景，网站上的所有案例都提供了代码。
7. Pure CSS Stripes Generator
🎗️ 传送门：『Pure CSS Stripes Generator』
Pure CSS Stripes Generator 次要是帮你生成 条纹背景 的代码。
你能够在网站上依据本人的需要设置条纹的色彩、大小、歪斜角度等属性。
最初会返回一段 css 代码给你。
8. Glass Morphism
🎗️ 传送门：『Glass Morphism』
Glass Morphism 的性能是设置 毛玻璃背景 款式，你能够在下面手动调节毛玻璃的不透明度、含糊度、背景色等属性。
最初会返回 html 和 css 代码给你。
十分好玩，连忙去试试吧~
9. uiGradients
🎗️ 传送门：『uiGradients』
提供了不同色系搭配的突变代码。如果你不太善于配色，能够应用 uiGradients
10. Gradient Colors Collection Palette
🎗️ 传送门：『Gradient Colors Collection Palette』
Gradient Colors Collection Palette 上有几十个色卡，能够一键复制 css 代码。
11. Fresh Background Gradients
🎗️ 传送门：『Fresh Background Gradients』
Fresh Background Gradients 提供了即便个配色计划，有双色的，也有多色的。同样提供一键复制 css 代码。
12. Cool Backgrounds
🎗️ 传送门：『Cool Backgrounds』
能够生成 5 种类型 的背景图片，并且提供多套成熟的配色计划供你抉择。
但该网站生成的是背景图片，不是代码。
13. Svg Wave
🎗️ 传送门：『Svg Wave』
生成波浪背景图，能够自定义波浪的幅度、色彩等属性。
反对 SVG 和 PNG 下载。
14. Subtle Patterns
🎗️ 传送门：『Subtle Patterns』
提供了几十种纹理图。
15. Stripe Generator
🎗️ 传送门：『Stripe Generator』
可配置的条纹背景图片。
16. ZenBG
🎗️ 传送门：『ZenBG』
在线设置纹理背景和突变色彩，最初交融在一起生成一张难看的图片。
同时还提供 css 代码给你参考，通知你如何更好的应用这张图片。
17. Patterninja
🎗️ 传送门：『Patterninja』
光看图片介绍就晓得这个网站好好玩。
Patterninja 帮你生成 可平铺 的背景图。
18. The Pattern Library
🎗️ 传送门：『The Pattern Library』
提供几十款可 平铺 的难看背景。
留神：下载按钮在网页的左上角。
点赞 + 关注 + 珍藏 = 学会了