✏️ SVG路径编辑器

广告位 - 顶部 (728×90)

编辑SVG path数据,实时可视化预览。支持所有SVG路径指令(M/L/H/V/C/S/Q/T/A/Z)。纯前端处理。

点击"解析指令"查看路径分析
广告位 - 中部 (728×90)

常见问题

什么是SVG Path?

SVG Path是SVG中最强大的绘图元素之一,使用 d 属性定义一系列绘图指令(命令+坐标),可以绘制任意形状。主要命令包括:M(移动到)、L(画线)、C(三次贝塞尔曲线)、Q(二次贝塞尔曲线)、A(弧线)和Z(闭合路径)。

SVG Path命令有哪些?

M=移动到(move to), L=画线(line to), H=水平线, V=竖直线, C=三次贝塞尔曲线, S=平滑三次贝塞尔, Q=二次贝塞尔, T=平滑二次贝塞尔, A=弧线, Z=闭合路径。大写表示绝对坐标,小写表示相对坐标。

如何学习SVG Path?

可以从简单的形状开始(如矩形用M+L),然后尝试弧线和贝塞尔曲线。本工具的「加载示例」按钮提供了多种示例,结合「解析指令」可以理解每个命令的作用。

这个工具在线使用安全吗?

完全安全。所有SVG路径渲染和解析都在浏览器本地完成,无需上传任何数据到服务器。