利用ps导出svg（主要用于上传自定义图标到iconfont）

ps版本：2020
借鉴文章：https://blog.csdn.net/k912120/article/details/118787809

事情起因是我不想多此一举下个AI,本来想ps直接导出svg格式,但是导出来上传到iconfont后却是一片空白，相信很多人第一次都遇到过这种情况。

我一愣，然后打开svg代码看到内容却是这样，怎么会有image标签

当然了，也不是说这种不能用，只是不能用于iconfont上传相对于我们正常的svg

下面正式开始

1. 准备修改的图片

因为我是想稍微修改一下iconfont本来的一个图标，所以我就直接点击那个图标的AI下载（主要是为了清晰度，png的话对于我来说虽然能用，但是清晰度不够）

2. 打开ps，载入图片

如果是AI的eps，导入时会有栅格化提醒
模式记得选择RGB颜色

3. 点击魔棒工具，或者快速选择工具，将整个图案选上

如果是png或者jpg格式的话，现在缺点就暴露出来了，就是区域模糊。这里我放个对比就知道了

• AI的eps
  
• png格式
  

4. 建立工作路径

图片上右键，然后点击建立工作路径
会有一个弹框，我直接写的1.0

• eps
  
• png（如果图形简单，你也可以再用钢笔工具稍微描好点）
  

5. 设置自定义形状

点击左侧工具栏钢笔工具，在图片区域右键点击定义自定形状
会有个弹框，随便命名

6. 矩形工具

点击左侧矩形工具，选择里面的自定形状工具
这时能看到上面有我们刚创建的自定形状，没有的话点击旁边的小三角也会看到，然后选中

7. 创建自定形状

点击一下画布区域，弹出创建自定形状

8. 得到路径图形

点击确定就得到一下和我们原本图形一样的图形
一般位置都不是对齐的 ，这时我们需要用工具栏的移动工具将两个图重叠

9. 导出

点击 文件 - 导出 - 导出为
弹框里面 格式选择SVG ，写好合适的尺寸，就可以点导出了

10. 结尾

这时我们看代码就有path绘制了

当然，这个image是你最开始载入的图形（严谨的话，你也可以在导出的时候删掉那个图层，或者删掉这里的image，其实我们需要的只是后面的那个形状图形）

此时，上传iconfont就完全没有问题