SVG 最酷的功能之一是，尽管它功能强大，但它仍然是可读代码。想要绘制矩形？它不是一串奇怪的乱码字符，而是
<rect x="50" y="20" width="300" height="100" />你会称之为标记，一种声明式语言。您可以用这种方式绘制任何形状，以及声明和使用诸如渐变，甚至动画和交互之类的元素。此外，它不是专有格式。您不需要使用许可。它是一个 开放规范!
SVG 仅仅是标记的想法让一些开发人员十分着迷。
你可以直接 学习 即使是最初看起来很复杂的 SVG <path d="" /> 语法。它只是坐标！带有说明如何从一个坐标移动到另一个坐标的指令。想要绘制一个加号？它可以 简化为
<path d="M2 1 h2 v1 h2 v1 h-1 v1 h-1 v-1 h-1 v-1 h2 z" />或者从循环中 创建 SVG ，享受预处理器的乐趣！
它让某些类型的开发人员产生这样的想法… 嘿！我可以制作一个帮助构建和编辑 SVG 的应用程序！ 是的，确实可以。JavaScript 拥有您需要的所有工具。它很乐意 提供您点击位置的坐标信息 等等，甚至 拖放也是一项功能 。结合这样的想法，您可以想象一个完整的基于浏览器的应用程序，用于创建和编辑 SVG。
互联网的美妙之处在于，由于您可以构建一个可视化的应用程序来创建和编辑 SVG，因此许多人已经做到了。
不出所料，甚至还有很多选择！没错，完全免费的基于浏览器的 SVG（矢量）编辑工具。
我认为我们很多人认为像 Adobe Illustrator 这样的工具是矢量编辑领域中的王者。或者可能是它的开源同类软件 Inkscape。虽然这些仍然是很棒的工具，但是如果您的需求是 SVG 编辑，那么您可以通过查看以下这些选项来提高速度并节省资金。
以下大多数选项几乎无需解释。工具栏可以让您访问绘图和操作工具。您可以更改颜色，拖动物体，以及您期望能够进行的大多数操作。当然，一些功能有所不同。如果您认真想找一个用来进行大型工作的工具，那么您应该尝试所有工具。
Method Draw
SVG-edit
Vector Paint
Drawing SVG
Vecteezy Editor
Vectr
Janvas
Boxy SVG
RollApp / Inkscape
这个需要稍微解释一下。您可能听说过 Inkscape。Adobe 软件，尤其是 Adobe Illustrator 的长期开源替代品。通常情况下，Inkscape 不会出现在此列表中，因为它不是基于浏览器的。但事实证明，它可以是！
RollApp 是一项服务，可以帮助您 启动 Inkscape （以及各种其他应用程序），本质上是将其作为浏览器弹出窗口。
我在开头提过，如果您认真想在这些工具中进行大型工作，那么您应该尝试所有工具。的确如此。由于大多数工具都是免费的，而且我承认，我从未在任何工具中进行过真正辛苦的一天工作，因此我不想告诉您哪个最好。
我可以告诉您我确实信任另一个基于浏览器的设计工具，名为 Figma。它属于一个稍微不同的类别，因为它更适合全面的设计工作，而不仅仅是 SVG 编辑，但它肯定是一款支持矢量的应用程序。我确实在 Figma 中投入了一整天的时间工作，并且效果很好。另一个需要考虑的选项？ Invision Studio，一旦它对所有人开放。