Coolors渐变色彩导出指南：轻松实现渐变预设

Coolors AI 暂不支持将渐变预设直接保存为特定格式，但您可以通过四种主要方式将其导出：一是获取 CSS 渐变代码，二是使用开发者工具提取 SVG 渐变定义，三是借助第三方工具转换为 .ase 文件，四是在 Illustrator 中手动重建并保存为渐变色板。

如果您在 Coolors AI 中构思出了令人满意的渐变方案，却发现无法将其保存为可供其他项目调用的预设文件，这通常与所使用的导出路径或格式有关。接下来，我们将详细介绍导出渐变色预设的具体操作流程。

一、通过 Coolors 界面导出渐变色代码

Coolors 平台目前虽不直接支持将渐变保存为 .grd 或 .ai 格式的预设文件，但可以导出为通用的颜色代码，便于您在 Illustrator 或 Photoshop 中手动重建渐变。此方式适用于需要跨平台复用颜色逻辑的场景。

1、完成渐变配色后，点击右上角的 Export 按钮。

2、在弹出的菜单中选择 CSS Gradient 选项。

3、复制生成的线性或径向 CSS 代码，例如 background: linear-gradient(90deg, #ff6b6b, #4ecdc4);。

4、将该代码粘贴至文本编辑器中，并保存为 .txt 文件，作为渐变参数的备忘记录。

二、使用浏览器开发者工具提取 SVG 渐变定义

当 Coolors 页面中显示可视化渐变条时，其底层实现通常基于 SVG 的 中的 或 元素。此方法可获取原始 SVG 渐变结构，用于导入支持 SVG 渐变的矢量软件。

1、在 Coolors 渐变预览区域右键，选择 检查元素（Inspect Element）。

2、在 Elements 面板中定位到包含 的代码块。

3、右键该 节点，选择 Copy → Copy outerHTML。

4、新建 .svg 文件，将复制内容粘贴进

三、借助第三方转换工具生成 Illustrator 兼容渐变文件

Illustrator 无法直接读取 Coolors 的输出，但可通过中间格式转换生成可导入的 .ase（Adobe Swatch Exchange）文件。此方法依赖外部脚本解析 CSS 渐变并映射为多节点色标序列。

1、访问支持渐变转 ASE 的在线工具。

2、粘贴从 Coolors 导出的 CSS Gradient 字符串。

3、点击Convert to ASE，下载生成的 .ase 文件。

4、在 Illustrator 中执行 窗口 > 色板 > 色板库菜单 > 其他色板库 > 载入色板，选择该 .ase 文件。

四、手动重建并保存为 Illustrator 渐变色板

这是最可靠且完全可控的方式：将 Coolors 渐变颜色值逐个输入 Illustrator 渐变面板，再保存为可复用的色板。适用于对颜色精度要求高的专业设计流程。

1、在 Coolors 页面点击每个色标，记录其十六进制颜色值（如 #FF5252）。

2、在 Illustrator 中绘制矩形，打开窗口 > 渐变面板。

3、点击渐变滑块下方空白处添加色标，依次双击各色标，用拾色器输入对应的 HEX 值。

4、调整各色标位置与不透明度后，在色板面板菜单 > 新建渐变色板中保存。