Blend 网页渐层背景产生器，选择颜色即时预览建立 CSS 原始码

现在很常在网络服务或网站上看到渐层背景应用，记得早期都必须使用图片堆叠出来，不过后来已经可以写入 CSS 样式，只要指定颜色代码和呈现方式即可。虽然知道有这功能，但要立即写出来好像也不是那么容易，还好有网站可以参考，例如 Gradient Backgrounds 收录各种渐层背景产生器的一站式工具，简单一点还有 ColorSpark、CoolHue 这类渐层色组合产生器，可快速建立 CSS3 语法，复制到网站就能套用。

本文要介绍的「Blend」是一款让使用者建立、自订 CSS3 渐层背景的在线工具，选择两种颜色，点选 Let’s Blend! 将渐层效果直接预览显示于网站背景。Blend 还能控制渐层角度、线性渐层（Linear Gradients）或径向渐层（Radial Gradients），最终产生对应的程序码。

如果你在开发网站或网络服务时正好需要渐层背景，不妨打开 Blend 网站试试看，就能很快速很简单地解决背景颜色需求。

网站名称：Blend
网站链结：https://www.colinkeany.com/blend/

使用教程

STEP 1

开启 Blend 网站，从左右两边设定一下渐层的颜色，点选中间的 Let’s Blend! 混合。

STEP 2

混合后直接从 Blend 背景预览效果，看看是不是符合自己的期待。

STEP 3

右上角可以切换渐层模式，例如线性渐层或径向渐层，点选线性渐层时还能调整渐层的角度数据，调整时背景预览会即时更新。

STEP 4

最后，点选右上角按钮就能产生对应的 CSS 程序码啰！将它加入网站的样式表，就能看到渐层背景效果出现在网页中。

值得一试的三个理由：

1. 设定两种颜色，直接于网页中预览渐层背景效果
2. 可选择线性渐层或径向渐层，可设定渐层角度
3. 产生 CSS 原始码贴到网页样式表就能套用