StyleSVG

修改 SVG 颜色

直接在浏览器里几秒钟修改 SVG 颜色。工具会列出文件中用到的每种颜色,你可以用取色器逐一替换,或把整个设计改成一种颜色,修改结果与原图并排显示。下载改色后的 SVG,或转成 PNG、JPG、PDF。不上传任何内容。

拖入 SVG 文件即可修改颜色

最大 10 MB 的 SVG · 在浏览器里转换,不会上传

选择 SVG

SVG 在你的设备上转换,不会上传。文件里引用的外部字体和图片不会被加载。

带红色斑纹的黑色蜘蛛 SVG 插画
修改前:三种颜色,黑色身体和红色斑纹。
同一只蜘蛛改成紫色和金色 | 修改 SVG 颜色
修改后:黑色 → 紫色,红色 → 金色,共修改 10 处颜色值。

为什么要给 SVG 换色?

矢量文件换色不会有任何损失,因为颜色只是代码里的数值。用对工具只需几秒,不必打开设计软件。

匹配品牌或产品

买来的切割文件或图标颜色不合适?换成你的品牌色、手头的刻字膜颜色或产品照片的色调,所有形状保持原样。节日版本,比如 Logo 的红绿圣诞版,一分钟就能做好,无需重新设计。

解决其他软件改不了色的问题

Canva、Cricut Design Space 和部分建站工具只允许修改某些 SVG 的颜色,甚至完全不能改。直接修改文件里的颜色到哪里都有效,因为新颜色已保存在 SVG 中。

为网页准备图标

网页开发经常需要单色图标或由 CSS 控制颜色的图标。把颜色替换为 currentColor,图标就会跟随周围文字的颜色,包括悬停效果。

为什么用这个 SVG 换色工具?

在代码里手动改色又慢又容易出错。这个工具会找到每种颜色出现的所有位置,一次全部修改。

无论怎么写,都能找到每种颜色

颜色可能藏在属性、style 属性、样式表规则和渐变色标里,同一种红色可以写成 red、#f00 或 rgb(255, 0, 0)。工具会把它们合并为一个色块,并统计使用次数。渐变色标也会列出,不用打开编辑器就能重新调整双色渐变。

处理隐藏的默认黑色

没有设置填充的形状默认显示为黑色,代码里没有颜色可改。工具会把它们列为“默认黑色”,选择新颜色时给整个图形设置填充。

先换色,再转换

编辑区下方可以直接把改色后的文件保存为 PNG、JPG、WebP、ICO、PDF 或 DXF。一切都在浏览器中运行,设计不会外泄,无需注册,不限次数。

3 步修改 SVG 颜色

大多数设计一分钟内就能改好,可以随时还原重试。

1

打开 SVG

把 10 MB 以内的 .svg 文件拖到上方,点“选择 SVG”,或粘贴 SVG 代码后点“载入代码”。颜色列表会出现在预览旁边。

2

选择新颜色

点任意色块旁的颜色框选择新颜色,或用“全部改成这种颜色”生成单色版本。勾选 CSS 会把该颜色替换为 currentColor。“修改后”预览会实时更新。

3

下载或转换

点“下载改色后的 SVG”保存新文件,点“复制代码”粘贴到网页里,或在下方转换器中选择图片格式。

给 SVG 换色的小技巧

这几点能让换色更快、结果更干净。

合并相近的颜色

描摹或导出的图形里常有几种几乎相同的颜色。把它们设成同一个新颜色,切割机或印刷店看到的就是一种颜色而不是五种。颜色越少,需要剔除的图层越少,激光机也能少走几遍。

在深色背景上检查白色图形

改成白色后,部分图形可能在白色预览中看不见。预览背后的棋盘格能显示透明区域,SVG 查看器还可以切换到黑色背景。

SVG 查看器 →

手上只有 PNG 或 JPG?

如果设计是一张照片或平面图片,先用我们的 AI 转换器把它变成形状分离的彩色 SVG,再到这里换色。

PNG 转 SVG →

修改 SVG 颜色常见问题

准备好给 SVG 换色了吗?

修改 SVG 颜色