渐变生成器
调出喜欢的渐变,直接复制 CSS。
浏览器本地处理输入渐变色标输出CSS
- 1添加输入
- 2调整设置
- 3获取结果
工具输入和文件在当前浏览器处理,不会上传。
开始之前
按校验后的颜色及位置生成线性或径向渐变。色标按位置排序,预览与复制的 CSS 使用同一个生成值。
如何使用
- 调整已有色标的颜色和位置,至少保留两个;需要时可继续添加,也可在 JSON 编辑框精确调整。
- 选择线性或径向渐变。线性渐变还可设置角度,然后点击“生成渐变 CSS”。
- 核对预览,再复制或下载 CSS。
支持范围与限制
粘贴文本最多 1 MiB;处理后请核对结果。
操作示例
示例输入
[{"color":"#000","position":100},{"color":"#fff","position":0}]示例参数
{}示例输出
background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(0, 0, 0, 1) 100%);
出现问题时
请使用已说明的输入格式,并遵守界面限制。用于其他文档或应用前请复核结果。修改输入会将旧结果标为已过期;运行失败会清除旧结果。
常见问题
我的文件会上传吗?
不会。文件和工具输入在当前浏览器处理;站内切换可在同一标签页暂存工作状态。刷新或关闭标签页后无法恢复,请及时下载需要保留的结果。
需要检查结果的哪些方面?
按校验后的颜色及位置生成线性或径向渐变。色标按位置排序,预览与复制的 CSS 使用同一个生成值。