可编辑路径 • 单色与彩色描摹

图片转 SVG

在浏览器中把栅格图片描摹为可编辑的 SVG 路径，提供单色图形与彩色图层两种档案，并可调整颜色精度、曲线拟合和输出优化。

将栅格图片转换为可复用的 SVG 路径

把栅格图片转换为 SVG 路径文档。单色图形档案按黑色阈值或自适应阈值描出单色形状，彩色图层档案保留图片自身的颜色并分层为可编辑区域；设置面板把描摹相关的参数集中在一起：杂点过滤、颜色精度、渐变步长、颜色上限，以及决定轮廓走向的拐角、线段和拼接阈值；路径精度、曲线简化、输出优化和 Watershed 细节则收在「高级」里。

如何将图片转换为 SVG

  1. 1.拖入图片、选择文件，或从剪贴板粘贴图片。
  2. 2.标志和图标选单色图形，插画和照片选彩色图层；彩色档案再在「区域生成」里选择 Color clustering 或 Watershed。
  3. 3.设置黑色或自适应阈值，按需调整「曲线拟合」和「输出」，只有在需要控制体积时才展开「高级」（例如路径精度或曲线简化）。图片载入后会自动开始描摹，此后每次改动设置都会自动重新描摹，不需要点生成。
  4. 4.预览 SVG、复制源码，或以 SVG 文件下载结果。

这个 SVG 转换器可以做什么

图片在页面内解码，所有步骤都在当前浏览器标签页里、在你自己的设备上完成，文件不会上传到转换服务器。

单色图形与彩色图层两种档案，覆盖标志、图标、线稿、扁平插画和照片。

设置面板把描摹相关的参数集中在一起：颜色精度、渐变步长、颜色上限，以及决定轮廓走向的拐角、线段长度和拼接三项阈值。路径精度、曲线简化、输出优化和 Watershed 细节收在「高级」折叠区里；每项参数旁的问号会说明它的作用，「重置设置」可恢复默认值。改动任何一处都会自动重新描摹。

结果面板给出处理尺寸、SVG 大小和路径数量，方便对比后再预览、复制或下载。

图片转 SVG 常见问题

图片会被上传吗？

不会。解码、描摹和预览都在当前标签页里、在你自己的设备上完成，没有任何转换服务器会收到文件。

生成的是真正可编辑的 SVG 吗？

是。结果是 SVG 的路径数据，而不是塞进 SVG 文件里的位图：图形、颜色和节点都能在设计软件里继续编辑，放大到任意尺寸也不会出现像素块。

每个下拉选项分别是什么作用？

方式决定图片被拆成区域的方式：Color clustering 把相近颜色合并成色块，适合标志、图标和扁平插画；Watershed 沿物体边缘划分区域，保留更多小细节。图层叠加决定这些区域怎么存放：Stacked 让图形互相覆盖，文件更精简；Seam-free cutout 让相邻区域共边，编辑时边界两侧保持一致。曲线模式决定轮廓的表达方式：Spline curves 画出平滑曲线，是默认选项；Polygon 使用直线段；Pixel edges 保留描摹出的阶梯状轮廓。输出优化决定文件被改写多少：Off 完全按描摹结果输出；Quantize + clean 取整坐标并删掉多余指令；Shorthands + grouping 还会把重复属性合并成更短的路径，文件最小。

支持哪些图片格式？

可以选择 JPEG、PNG、WebP、AVIF、BMP 或 GIF 图片。能否打开某种格式，取决于浏览器自身的图片支持情况。

单色图形和彩色图层有什么区别？

单色图形使用二值区域生成：比黑色阈值更暗的像素（控件范围 1–255，默认 128）会合成一个单色形状。彩色图层使用 Color clustering 或 Watershed 区域生成，把图片的颜色保留为可编辑的 Stacked 或 Seam-free cutout 区域。

黑色阈值是做什么的？

它决定单色图形档案里哪些像素会变成形状，比它更暗的像素会被描出来。控件范围 1–255，默认 128：数值越大，越多的像素变成形状、填色更实；数值越小，只保留最暗的区域。

光线不均的扫描件也能描摹吗？

可以。在单色图形档案里打开自适应阈值，就会把每个像素和它周围的亮度作比较，而不是用固定阈值，照片或扫描件里光线不均时就不会把大片区域压成一整块。自适应灵敏度范围 5%–40%，默认 15%，表示低于局部均值的百分比；自适应窗口范围 0–64 像素，0 表示自动选择窗口。开关打开后，这两个控件就出现在它旁边。

杂点过滤做什么？

两种档案都会丢弃小于该像素数的斑块。范围 0–128，默认 4：调大可以去掉灰尘和成团的噪点，细节优先时调小。

什么时候用 Watershed？

Watershed 是彩色档案里 Color clustering 之外的另一种区域生成方式：它顺着物体轮廓划分区域，而不是只按颜色相近，所以照片和插画里的小细节能保留更多。Watershed 细节决定区域切分的粗细：滑块范围 16–256，步长 8，默认 128；数值越大保留的区域越多，路径也越多。

颜色精度、渐变步长和颜色上限会怎样改变彩色描摹？

颜色精度决定两种颜色要多接近才会合并成同一块区域（1–8，默认 6），数值越大保留的颜色变化越多、路径也越多。渐变步长是渐变色层之间的色差（0–255，默认 16）：数值越小保留的渐变层次越多，数值越大则合并成更少、更大的区域。颜色上限把输出压到最多 32 种颜色，默认关闭（0 表示保留描摹出的全部颜色）。

Stacked 与 Seam-free cutout 有什么区别？

Stacked 是默认方式：形状之间可以重叠，文件保持精简。Seam-free cutout 生成没有缝隙的拼块，相邻区域共享边界，因此同一条边界在编辑过程中保持一致。

曲线拟合里的参数分别改什么？

曲线模式可选 Spline curves（默认）、Polygon 折线或 Pixel edges。用于微调 Spline curves 轮廓的三个阈值只在选中 Spline curves 时出现在曲线模式旁边，改为 Polygon 或 Pixel edges 时会隐藏：拐角阈值范围 0–180 度、默认 60 度，用来判断轮廓在何处算作拐角；线段长度范围 3.5–10、默认 4，决定路径中保留的最短线段；拼接阈值范围 0–180 度、默认 45 度，用于连接短曲线段。

怎样把 SVG 文件改小？

路径精度决定路径坐标的小数位（0–8，默认 2），位数越少文件越小。曲线简化会在 0–3 像素的容差内用尽量少的三次曲线重新拟合平滑段，默认关闭。输出优化有三档：Off、Quantize + clean（默认）以及 Shorthands + grouping。

透明区域会怎么处理？

彩色图层使用 Color clustering 时，如果图片整体足够透明，会启用透明键控：完全透明的像素不参与描摹，背景因此保持透明。单色图形和 Watershed 不做透明键控，会描摹整个画面；只想描出可见图形时，先把图片压平到白底。

图片很大时会怎样？

处理尺寸上限是单色图形最长边 2048 像素、彩色图层 1280 像素，更大的图片会等比缩小。结果体积偏大时，可以提高杂点过滤、打开曲线简化、降低路径精度，或改用 Shorthands + grouping 优化。彩色描摹的区域越少越轻，提高渐变步长或降低颜色精度都能减少区域。