使用<；将图标图像转换为svg的最佳方法；路径>；标签

我正在学习使用svg图标，现在尝试直接从psd中提取图标。使用adobe photoshop 2017，可以将图像导出为svg代码。然而，在这段代码中，不是生成标记而是生成标记（据我所知，这是base64编码？！）。正因为如此，我不能修改图标，例如，给他们不同的颜色（填充）等

我的问题是-什么是将图像转换为svg的最佳方式，以便它包含标签，最好是使用photoshop

基本上，我想要这样的东西：

<svg fill="#000000" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
<path clip-rule="evenodd" d="M0 0h24v24H0z" fill="none"/>
<path d="M22.7 19l-9.1-9.4z"/>

这大概就是我使用photoshop得到的结果：

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="34" height="48" viewBox="0 0 34 48">
              <metadata><?xpacket begin="" id="W5M0MpCehiHzreSzNTczkc9d"?>
            <x:xmpmeta xmlns:x="adobe:ns:meta/" x:xmptk="Adobe XMP Core 5.6-c138 79.159824, 2016/09/14-01:09:01        ">
               <rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
                  <rdf:Description rdf:about=""/>
               </rdf:RDF>
            </x:xmpmeta>                          
            <?xpacket end="w"?></metadata>
            <image width="34" height="48"  xlink:href="data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAwCA0gTiVBORw0KGgoAAAANSUhEUgAAACIAAAAwCA0gTiVBORw0KGgoAAAANSUhEUgAAACIAAAAwCA0gT="/>
          </svg>

---

另外，我试过base64的几种在线解码器，但没有发现它们有用

毕竟我发现这个工具最有用-。它可以快速、精确地转换为svg，而且不需要进行大量定制。在图像上，第一个图标是inkscape结果，第二个图标来自vector magic

---

也许我在inkscape中错过了一些东西，结果是如此完美。那样的话，请指出。无论如何，vector magic节省了很多时间，而且我还没有发现它的缺陷。

您需要“跟踪”位图图像。您可以自己手动完成，也可以使用大多数向量编辑器中内置的跟踪工具。例如Inkscape、Illustrator等）…在我看来，使用Illustrator并不是开发人员的工作，这似乎非常耗时。也许我错了？我在寻找一些可以使这个过程快速或至少自动化的工具。不，你是对的。如果你需要矢量格式的艺术品，那么设计师的工作应该是提供这种格式的艺术品。他们应该知道位图和矢量艺术之间的区别，以及他们应该使用哪种软件来制作它。它似乎不是免费的。那不是免费的工具，试一个吧。@Mohammadlm71，我试过这个工具，它非常有用imprecise@Annie-h、 所以最好的工具是CorelDraw，只需安装它，然后使用PowerTrace功能就可以将每个图像转换为SVG路径。