AnyToSVG
免费 · 无需注册 · 不上传图片

WebP转SVG在线工具
网页图片一步变成可编辑矢量图

拖入WebP,大约一秒就得到清晰可缩放的SVG,不用先转成PNG。透明背景原样保留,颜色自动识别,文件不会离开你的浏览器。

< 1 s
通常的描摹用时
0
字节被上传
$0
无积分、无水印

把图片拖到这里

WebP,也支持PNG、JPG、GIF、BMP、AVIF,最大20 MB

选择图片

或按Ctrl+V粘贴

试试示例: Logo 线稿 剪贴画
浏览器本地运行
Potrace编译为WebAssembly,无需上传
免费,无需账号
无积分、无水印、无次数限制
彩色或黑白
真正的SVG渐变,一键透明背景
输出干净的SVG
每种填充一条路径,坐标与原图像素一致,哪里都能打开

为什么WebP要单独说

多数工具要你先把WebP转成PNG,这个不用

浏览器原生解码WebP,描摹引擎直接读取。

WebP是现在大多数网站使用的图片格式:同样画质下比JPG小25–35 %,而且与JPG不同的是,它支持透明和无损压缩。麻烦在于,很多桌面软件和老一点的矢量化工具打不开它,于是大家只能先把WebP转成PNG,再把PNG转成SVG,既费事,有时还损失画质。

AnyToSVG直接使用浏览器自带的解码器,目前所有主流浏览器(Chrome、Edge、Firefox、Safari 14+)都原生支持WebP。文件在你的电脑上解码,分析颜色和渐变,再用编译为WebAssembly的Potrace描摹,流程与PNG完全相同。如果WebP是无损的,效果和PNG一样干净;如果是有损的,压缩痕迹比JPG轻,但依然存在,放大后边缘毛糙的话,可以在高级选项里勾选先降噪。

也支持WebP动图:会描摹第一帧。另一种新的网页图片格式AVIF,在能解码它的浏览器(Chrome、Firefox、Safari 16+)里用法相同。

透明背景

带透明的WebP,转出来依然透明

会保留透明通道;纯色背景一个勾选就能去掉。

WebP和PNG一样可以保存透明通道。不透明度低于50 %的像素会被当作空白、不会被描摹,所以从网页上保存下来的Logo或抠好图的商品图,转成SVG后背景同样是透明的。如果WebP被压在纯色背景上,就勾选透明背景:与图片边缘相连的那种颜色会被去掉,图稿内部被包围的同色区域则保留。

其余输出和其他输入格式完全一样:每种颜色一条<path>路径,明暗过渡区域用真正的SVG渐变,viewBox采用原图像素尺寸,文件里没有其他东西。它可以在Illustrator、Inkscape、Figma、各类刻字机软件和任何浏览器中打开。

常见来源

从网页上保存下来的Logo和图片

现在右键“图片另存为”,保存下来的经常就是WebP。

WebP转SVG最常见的原因,是从网页上保存的Logo、图标或插画:浏览器给了你一个.webp文件,而设计软件或刻字软件却不认。因为这类图片是为网页做的,通常很小,只有200到600像素,所以AnyToSVG会在计算矢量图之前,用适合描摹的滤波方式把它放大两到三倍。曲线会比直接用大图时稍圆润,但纯色块的Logo仍然能描摹成寥寥几个干净的图形。

如果网站提供了更大的版本(在新标签页中打开图片,看网址里有没有尺寸参数,或者查看有没有srcset里的2倍图),请用那个:1000像素的原图始终比放大的300像素图更好。保存成WebP的照片和其他照片一样,会被海报化成最多32种颜色加渐变,是一种风格化效果而不是更清晰的照片;具体效果见JPG转SVG。

使用方法

WebP图片怎么转成SVG

只有三步,第二步还可以跳过。没有繁琐的向导,不用选模型,也没有积分计数。

查看图文教程
  1. 空白的转换器:大块拖放区、“选择图片”按钮和三张示例图
    01

    拖入图片

    把图片拖到页面上、从电脑里选择,或按Ctrl+V粘贴,马上开始分析和描摹。彩色还是黑白、该用几种颜色、阈值多少,都会自动识别。

  2. 设置面板:模式切换、颜色数滑块、识别出的色块和“透明背景”复选框
    02

    看预览,需要再调整

    拖动原图和SVG之间的分隔线对比,放大看边缘。可以改颜色数、隐藏某种颜色、把背景变透明,每次修改都在不到一秒内重新描摹。

  3. 结果面板:SVG大小、图形数和“下载SVG”按钮
    03

    下载SVG

    保存SVG文件、复制SVG代码,或导出2倍、4倍大小的PNG。坐标与原图像素一致,每种填充一条路径,文件里没有多余内容。

小技巧

让WebP转SVG的效果更干净

01

不用绕道PNG

直接把.webp拖进来。先转PNG没有任何好处,而且对有损WebP来说,还会把压缩痕迹重新编码一遍。

02

找找2倍图

网站通常为高分屏准备了更高分辨率的版本。原图越大,曲线越平滑。

03

有损WebP先降噪

如果放大到400%时边缘毛糙,在高级选项里勾选先降噪,并把去除杂点稍微调大一点。

04

Logo把颜色数调低

自动识别会从图片里读出颜色数;如果压缩多生出了过渡色,把它设成设计实际用到的数量。

05

WebP动图

使用第一帧。如果要矢量化其他帧,先用图片编辑软件把那一帧导出成PNG。

06

在棋盘格上检查透明

预览背景可以在棋盘格、白色和深色之间切换,这样能清楚看到哪些区域是透明的。

常见问题

WebP转SVG常见问题

这里是简短回答;完整的常见问题还讲了格式、画质设置、照片和隐私。

WebP怎么转成SVG?

把WebP文件拖到本页,或者打开转换器选择它。浏览器负责解码,转换器一秒内完成描摹,然后下载SVG即可。不用账号,不上传,没有水印。

需要先把WebP转成PNG吗?

不需要。目前所有主流浏览器都原生解码WebP,转换器直接读取文件。多绕一步PNG只是多了一道手续,对有损WebP来说还会把压缩痕迹重新编码。

WebP的透明背景会保留吗?

会。透明像素不会被描摹,所以SVG在同样的位置也是透明的。纯色背景可以用透明背景复选框去掉。

WebP动图能转换吗?

会描摹第一帧。想要其他帧,先用图片编辑软件把它导出成PNG再转换。

我的WebP会被上传到服务器吗?

不会。WebP、PNG、JPG、GIF和BMP文件完全在你的浏览器里解码和描摹,不会发送到任何地方。详见隐私政策。

AVIF也可以吗?

可以,前提是浏览器支持解码AVIF(Chrome、Firefox、Safari 16及以上)。处理方式与WebP完全相同。

现在就把WebP图片转成SVG

免费、在浏览器里运行,无需安装,不上传图片。大约一秒,SVG就会和原图并排显示。

打开转换器