渐变背景生成器:支持 PNG 下载和 CSS 复制

将喜欢的颜色混合成平滑渐变,几秒内即可下载。

免费使用,无需注册、无水印。
画布
实时预览
1920 × 1080px
在本机生成预览已缩放,导出为完整尺寸

适用于网站和演示文稿的自定义渐变背景

为网站、演示文稿或壁纸创建平滑的颜色过渡。可以从柔和的靛蓝和紫色配色开始,再选择自己的颜色和渐变设置。通过自定义尺寸,您能直接准备适合设计的背景,无需缩放截图或裁剪图库图片。制作网站渐变背景时,可以比较下载 PNG 与“复制 CSS”两种方式:CSS 会随元素缩放,而图片文件具有固定的像素尺寸。

渐变图片的使用场景

创建网站首屏的渐变背景。

为演示文稿标题制作平滑背景。

设计自定义桌面和手机壁纸。

如何创建渐变 PNG 背景或复制 CSS

先考虑需要填充的空间:窄幅网站横幅、演示幻灯片,还是竖向背景。

选择线性、径向或锥形渐变

先从两种颜色和线性渐变开始,调整角度改变画布上的过渡方向,再判断是否需要第三种颜色。径向渐变围绕中心过渡,锥形渐变则让颜色绕中心旋转。

使用图片或复用颜色配方

其他应用需要背景文件时,PNG 是实用选择。制作网站时,“复制 CSS”可提供应用到元素上的渐变声明,其外观还取决于元素尺寸。锥形 SVG 导出使用矢量扇区近似绘制渐变。

检查文字背后的区域

渐变可能经过浅色和深色文字区域。请检查文字实际位置的背景色,不要假设一个采样点就代表整个背景。下载结果若出现明显色带,请先比较其他格式并按实际使用尺寸查看,再调整配色。

不确定如何选择文件?请阅读 图片格式指南 或比较 常用像素尺寸.

渐变图片常用尺寸

选择起始尺寸,所有尺寸均可自由调整。

在图片尺寸指南中查看更多尺寸

渐变图片:常见问题解答

下载前需要了解的信息。

可以将渐变下载为图片吗?

可以。选择尺寸和导出格式,然后下载生成的渐变。需要无损图片输出时,PNG 是合适的选择。

4K 渐变应该选择什么尺寸?

横向 4K UHD 背景使用 3840 × 2160 像素。交换宽高即可创建竖向画布。

从一张图片,开始下一次创作

给下一条动态定个底色,为屏幕换种心情,或为演示准备一张封面。选个场景,现在就开始。

给下一条动态,先定一个好底色

从 1080 × 1080 方形帖子或 1080 × 1920 竖版快拍开始,用自己的配色做一套背景。下载后在常用编辑器里加上照片与文字,让每条动态延续同一种风格。

把喜欢的颜色,变成每天的桌面

一抹落日色、一个纯净色块,或两种颜色的平滑过渡。按屏幕尺寸做一张属于自己的壁纸,电脑和手机都能换个心情。

让下一次演示,有个干净的开场

用纯白背景留出文字的位置,或用简洁渐变衬托标题。从 1920 × 1080 宽屏画布开始,下载后放进幻灯片、项目封面或课程资料。