◩
图片与设计工具
CSS Gradient Generator
CSS Gradient Generator 在浏览器中运行，用于检查、转换或准备结果，不会把输入发送到服务器。
图片与设计工具
Input / output
Color stops
Gradient preview
135deg
CSS code
background: linear-gradient(135deg, #18E299 0%, #2563EB 100%);
Tailwind background
bg-[linear-gradient(135deg,_#18E299_0%,_#2563EB_100%)]
HelpOpen usage notes, examples, practical tips, and FAQ only when you need them.
What is this tool?
CSS Gradient Generator 是面向图片与设计流程的本地浏览器工具，输入、选项和结果都在同一页面完成。
How to use it
- 粘贴输入
在输入区域输入或粘贴要处理的值。
- 调整选项
选择适合 CSS gradient, linear gradient, background 的模式、格式或单位。
- 检查结果
运行工具，确认结果后再复制或下载。
Examples
CSS Gradient Generator 示例
- Input
- 示例输入
- Output
- 在浏览器中检查后的输出。
Practical tips
- 内容较大时，先从小样本开始。
- 广告会保持在主要控件和结果区域之外。
FAQ
CSS Gradient Generator 应该输入什么？
请输入与页面任务匹配的值，并在运行前调整选项。
可以复制 CSS Gradient Generator 的结果吗？
可以。检查结果后即可复制或下载。
CSS Gradient Generator 支持移动端吗？
支持。输入、选项和结果会在小屏幕上纵向排列。
输入会发送到服务器吗？
不会。该工具设计为在浏览器内处理输入。