ICO 转 SVG Icon ↔ Scalable Vector Graphics 免费 在线 安全
放进一个 ICO 文件,带走一个 SVG。图片怎么办由你定:变成形状,或者原封不动留着——每种选法的代价写在下面,省得你先花了时间才知道。
转换你的文件
把你的 ICO 文件拖到这里,或者选一个。
你的文件不会离开这台设备。一切都在你的浏览器里完成。
不上传任何文件
矢量到底不同在哪里
SVG 不是一张图;它是一套画图的指令——这里一个这么大半径的圆,从这里到那里一条线,这个形状填上那种颜色。它在2001年成为网络标准;因为它存的是画法而不是结果,所以同一个文件既能画出十六像素的图标,也能印成一块广告牌。PNG 或 JPEG 存的恰恰相反:一张已经完成的彩色点阵,对是什么画出了它们毫无记忆。这种不对称决定了本页的一切。从矢量到位图,不过是按选定的尺寸把指令画出来;反过来走则是描摹——程序盯着一张点阵,猜测可能是哪些形状造出了它。
你会在哪里遇到它们
标志、图标、地图、示意图和统计图都以 SVG 存在,因为它们必须在任何尺寸下都清楚可读,而且常常要换颜色。网页小图标和应用图标都由它们做出来。反方向用于矢量必须变成平面图像的那一刻:一个不显示 SVG 的邮件程序、社交网站的预览图、一份要由软件比你更旧的人去打印的文件,或者一个只接受照片的上传表单。
常见问题
我描摹了一张照片,结果惨不忍睹。为什么?
因为描摹本来就不是为照片准备的。它的做法是找出颜色相近的区域,再在每一块周围画出轮廓;这适合平涂的图形——标志、镂空版、线描——却在照片上失败,因为照片里每一块区域都在缓缓融进下一块。描摹程序只得在本无边界之处造出一条边界,结果要么是海报式的平色斑块,要么是一个含着几万个细碎形状的文件。照片还是留在位图里为好。
为什么我的 SVG 在别的软件里看起来不一样?
通常是字体的缘故。含有文字的 SVG 按名字去引用字体,并指望打开它的机器装着那套字体;没有的话就换上别的,版式随之挪位。对症的办法是导出前把文字转为轮廓:每个字母变成一个形状,文件在哪里都一模一样——代价是文字再也不能编辑和选中。滤镜、混合模式这类高级效果,是另一个常见的差异来源。
文件会损失质量吗?
要看两种格式各自装得下什么。在存放同样内容的格式之间转换——PNG 转 BMP,WAV 转 FLAC——不会损失任何东西。转成为省空间而丢弃信息的格式,比如 JPEG 或 MP3,每转一次就损失一点,再转回去也拿不回来。凡是有选择余地的地方,本页倾向于保住原来的质量,而不是做出最小的文件。
我的文件会被上传到什么地方吗?
不会。转换发生在你自己的机器上、你的浏览器里面;文件从不离开它,这里也没有任何服务器能够接收它。正因如此,限制一个大文件的是你自己的内存而不是上传;也正因如此,你转换的任何东西都不可能出现在任何人的日志里——包括我们的。不过,音频和视频工具会在你第一次使用时从本站取来它们的转换引擎——约三十兆字节,仅此一次;此后工作依然完全在你自己的机器上进行。
人们为什么把 ICO 转成 SVG
ICO 文件是一个图标:一幅小图,或者更确切地说是一束不同尺寸的小图,出现在浏览器标签页、快捷方式、窗口角落或文件列表里。许多老网站和程序除了一个图标之外,就没有别的标志了:原来的绘图丢了,设计师不在了,而网站图标是留存下来的唯一一份标志副本。SVG 则是相反类型的文件:用形状描述的绘图,可以缩放到任何尺寸,并可随意重新着色。这就是人们把 ICO 转成 SVG 的原因:他们手头有一个小图标,却想要一幅可以用在更大尺寸、可以修改、可以放进现代设计的绘图。
对这样的转换能做什么、不能做什么,必须诚实。把像素变回形状,并不是找回原来的绘图,它已经不存在了。这是一种猜测,通过观察纯色区域在哪里结束来进行。然而,图标恰好是特别适合这种猜测的一类图片,因为它们一开始就是用纯色绘制的。本页提供两种选择,并在您花时间之前告诉您每种的代价:您可以通过描摹让图标变成形状,也可以让图片原封不动,包在一个 SVG 里。
本页在您的浏览器中把 ICO 转成 SVG。您的图标不会上传到服务器,这对尚未公开的标志和设计很重要。下面您会看到描摹如何工作、读取图标的哪个尺寸、保留什么,以及对这么小的图片该有什么预期。
转换如何工作
对图片的两种处理选择
您选择图片会发生什么:它变成形状,或原封不动。第一种是描摹。分析图标,找出单一颜色的区域,把它们的边界写成形状,用您要求的颜色填充。第二种是包装:图片原样放进一个 SVG 文件,所以文件外面是 SVG,里面是同样的像素。
读取哪个尺寸
一个 .ico 在一个文件中包含多个尺寸,浏览器交出其中一个,通常是最大的。其他的不会被读取。如果您的图标包含 16、32、48 和 256 像素的版本,被描摹的通常是 256 像素的那幅图。即使最大的也很小,常常是 48 或 256 像素,所以可描摹的东西很少。
为什么图标描摹得好
图标通常由边界清晰的纯色区域构成,因为它们被设计成缩小时仍可辨认。这是几乎能完美描摹的一类图片,因为它一开始就是用纯色绘制的。缩成图标的照片会毫无希望,但图标不是那样的。
保留什么
透明度
透明度被保留。图标几乎总是有透明背景,它在 SVG 中保持空白,所以形状可以放在任何颜色上。
清晰的纯色
图标通常所用的清晰纯色作为纯色形状保留。这是转换大放异彩之处:结果看上去干净,并且可以逐个形状重新着色。
比例与尺寸
描摹把作品的比例及其自身的像素尺寸保留在 SVG 的宽度和高度中。作为矢量,结果由此可缩放到任何尺寸。
转换 ICO 到 SVG 之前您应该知道的
可描摹的东西很少
图标里即使最大的尺寸也很小,常常是 48 或 256 像素,所以可描摹的东西很少。原图中任何单像素的线,都会变成一个宽度与其不确定性相当的形状。这不是描摹的缺陷:在十六像素时,那里从来就没有足够的东西。如果结果看上去粗糙,答案是更大的源图,而不是不同的设置。
只读取一个尺寸
您不能在文件内的各尺寸中选择。如果最大的版本质量差,描摹也会差。如果您有该标志更大尺寸的单独 PNG,PNG 转 SVG会给出更好的结果。
描摹是猜测,不是找回
描摹找出纯色区域在哪里结束,并把这些边界写成形状。对图标来说,这接近正确。但它提出的是曲线,而不是还原设计师画的那些。如果原始 SVG 或源文件存在,请使用它。
如何在此把 ICO 转成 SVG
添加您的图标
把 ICO 拖到页面上或从设备中选取。它在您的浏览器内读取,不会上传。
选择描摹或保留,以及颜色
决定图标应变成形状还是保持原样。如果描摹,设置颜色数;对于图标,通常少量颜色是合适的。
转换并比较
按下按钮并下载 SVG。在浏览器中打开并放大。好的描摹保持平滑。把它与图标比较,如果不对,调整颜色再试。
进一步了解 ICO 与 SVG
一束图与一幅绘图
ICO 是里面有几幅小图的容器,每幅尺寸固定,这样系统可以选择适合图标显示位置的那一幅。SVG 是可以按任何尺寸渲染的单幅绘图。把 ICO 转成 SVG,就是取其中一幅小图,去要它背后的绘图。反过来,SVG 转 ICO是精确的;这个方向是估计。
为什么结果可能与图标看起来不同
小图标常常是手工逐像素设计的,以便在其尺寸下好看。描摹把这些像素变成平滑的形状。转角可能略微变圆,细节可能变粗。SVG 是图片的忠实肖像,但不是设计师意图的复本。
何时避免描摹
如果图标是微缩的照片,比如头像,就不要描摹。让图片保持原样。描摹是为纯色构成的标志而设。
常见情形详解
作为网站图标幸存下来的丢失标志
老网站有时把标志唯一的副本留作网站图标。把 ICO 转成 SVG,在绘图程序里整理形状,您就有了一个可以据以在更大尺寸重建标志的基础。
程序图标
从旧软件中提取的图标可能是仅存的美术作品。描摹出的 SVG 让您能在文档中以看得清的尺寸重用它们。
让设计现代化
当网站或应用重新设计时,旧图标往往需要以现代尺寸重画。描摹出的 SVG 给设计师一个与现有标志吻合的起点。
要求 SVG 的网站
有些平台的标志只接受 SVG。如果保留图片对平台已经足够,可以包装图标。如果必须是真正的矢量,就描摹它。
把 ICO 转成 SVG 之前的实用建议
寻找更大的源图
在把 ICO 转成 SVG 之前,检查是否存在该标志的更大版本:网站上的 PNG、品牌套件、旧文档。更大的源图会给出好得多的描摹。
用少量颜色
大多数图标使用两到五种颜色。要求这个数量会给出与设计吻合的干净形状。
知道之后要做什么
描摹出的图标是一个起点。请计划在绘图程序里花几分钟整理形状、平滑曲线并给图层命名。
保留 ICO
ICO 是源文件。如果描摹不好,您会想用它以其他设置再试。
把 ICO 转成 SVG 时获得最佳描摹
数一数您预期的颜色
在把 ICO 转成 SVG 之前,看看图标并数一数它的颜色。白色方块上一片绿叶的图标需要两三种。要求这个数量会给出与设计吻合的干净形状。
留意边缘
小图标中两种颜色之间的边界,是一条中间色调的柔和线条,因为图片在绘制时被平滑过。描摹必须决定边缘落在这条柔和线条的哪里。它选择中间,这几乎总是对的。
考虑背景
如果图标有透明背景,它保持空白。如果标志后面有一个彩色方块,描摹会把它作为一个形状包括进来,您可能想把它删掉,以便标志可以放在其他颜色上。
转换之前人们问的问题
我能找回原来的矢量吗?
不能。描摹是猜测,不是找回。它提出沿着图片中颜色边界的形状。
为什么结果粗糙?
因为图标很小,常常是 48 或 256 像素,可描摹的东西很少。答案是更大的源图,而不是不同的设置。
使用 ICO 内的哪个尺寸?
浏览器交出其中一个,通常是最大的。其他的不会被读取。
透明度会保留吗?
会。透明背景保持空白。
我的图标会被上传吗?
不会。转换在您的浏览器中运行,图标永远不会离开您的设备。
我能回到 ICO 吗?
能。SVG 转 ICO以六种尺寸绘制形状,并把它们打包进一个文件。
转换 ICO 到 SVG 时明智选择
描摹还是保留?
描摹纯色图标。保留任何看起来像照片的东西。如果不确定,试着描摹,并把结果与原图并排查看。
其他起点
如果您有该标志的 PNG,PNG 转 SVG从更多像素开始。如果您有 JPG,JPG 转 SVG的工作方式相同,不过压缩噪点需要留意。
留住您起初拥有的
把 ICO 存放在 SVG 旁边。它们是不同的东西,各有用处。
转换后获得好结果
在绘图程序中打开
查看形状和颜色。删除零星的斑点,合并应为一体的形状,平滑出来凹凸不平的曲线。
在几种尺寸下检查
放大和缩小。好的描摹在每种尺寸下都保持其形状。
如果标志重要就重建
对于品牌标志,把描摹结果当作参考,干净地重画。一小时的工作会得到可以用多年的文件。
充分利用描摹出的图标
在缩放重要的地方使用
结果的巨大优势是可缩放。把它用于海报、标牌、刺绣补丁或贴纸,享受不必去找更大文件的轻松。当您再次需要像素图片时,SVG 转 PNG 工具可以按您选的任何尺寸绘制形状。
轻松重新着色
因为每个区域都是带填充的形状,改变颜色只需选中该形状并选另一种。这常常是人们首先把 ICO 转成 SVG 的原因:图标颜色不对,或需要一个能在深色背景上使用的版本。
重建尺寸组
一旦有了干净的 SVG,您就可以用SVG 转 ICO生成您需要的每种尺寸的图标文件,包括新的网站图标。新文件会包含从形状重新绘制的每种尺寸,比旧文件的缩放副本更清晰。
对别人的作品要小心
描摹图标并不赋予您对它的权利。请把转换用于您拥有或获许使用的标志。对于您自己的旧标志,这是让它们与时俱进的便利方式。
保留您喜欢的设置
当您找到对某类特定图标有效的颜色数时,把它写下来。下次您为类似的标志把 ICO 转成 SVG 时,您将从一个您知道能给出干净形状的设置开始。
隐私与处理
为什么本地转换对美术作品重要
标志和设计在发布之前可能是机密的。许多在线转换器把您的文件上传到服务器,处理后再送回结果,并且有一段时间副本存放在您无法控制的机器上。在这里,是您自己的浏览器做这项工作,所以图标留在您的设备上。
您离开时会发生什么
当您关闭页面时,转换后的文件会从浏览器中消失,所以请先下载。关于您图标的任何东西都不会被保留。
如果出了问题
描摹看上去凹凸不平
图标很小,细节很少。寻找更大的源图,或在绘图程序里整理形状。
似乎读取了错误的尺寸
只交出一个尺寸,通常是最大的。如果它质量差,请找更好的源图。
页面打不开我的文件
检查它是真正的 ICO,而不是改了名的 PNG。如果是 PNG,请改用PNG 转 SVG。
相关工具
同一系列的工具涵盖相邻的任务。对于 PNG,用PNG 转 SVG,对于 JPG,用JPG 转 SVG。要回到像素或图标,SVG 转 ICO、SVG 转 PNG和SVG 转 JPG按您选的尺寸绘制形状。用于印刷的矢量页面来自SVG 转 PDF。
一个实例
假设您继承了一个网站,标志唯一的痕迹是一个网站图标:透明背景上的一片绿叶。您需要这片叶子做印刷横幅。您把 ICO 拖到这里,选择两种颜色的描摹并按下按钮。片刻之后,您下载了一个 SVG,其中叶子是一个干净的绿色形状。您在绘图程序里打开它,平滑两个转角,并缩放到横幅大小。边缘保持锐利。ICO 留在您的文件夹里。
简短清单
转换之前
寻找该标志更大的源图。检查图标是纯色的平面作品。保留 ICO。
转换期间
选择描摹或保留,并设置颜色。停留在页面上直到文件准备好。
转换之后
打开 SVG,放大,与图标比较,并在绘图程序里整理它。
常见错误
期待从来不存在的细节
在十六像素时从来没有足够的东西可找。不要指望细线而把 ICO 转成 SVG。
描摹照片头像
微缩的照片会变成一张色块海报。让它保持原样。
用了太多颜色
更多颜色会给出嘈杂的形状。图标需要几种就用几种。
您的图标留在您的设备上
转换在本地进行。您的图标由您自己的浏览器读取,在那里描摹,并作为 SVG 交还。没有任何东西被上传,所以服务器上不会留下副本,别人也看不到它。对于未发布的标志,这是把 ICO 转成 SVG 的安全方式。
小结
要在此把 ICO 转成 SVG,拖入图标,选择对它的处理方式,然后按下按钮。您来选择:图片变成形状,或原封不动;而每种选择的代价,在您花时间之前就写在本页上。透明度被保留,图标通常所用的清晰纯色也被保留,这是几乎能完美描摹的一类图片,因为它一开始就是用纯色绘制的。一个 .ico 在一个文件中包含多个尺寸,浏览器交出其中一个,通常是最大的;其他的不会被读取。即使最大的也很小,常常是 48 或 256 像素,所以可描摹的东西很少。如果结果看上去粗糙,答案是更大的源图,而不是不同的设置。