SVG 工具

SVG Path Viewer

查看单条路径的形状、命令和几何边界,调整填充与描边后导出预览。

SVG 内容仅在您的浏览器中处理,不会上传到服务器。

这个工具是什么

SVG Path Viewer 适合检查图标轮廓和复杂曲线。您可以粘贴独立路径数据,也可以从 SVG 中选择路径,查看其形状、命令数量和几何边界,再生成独立的静态预览文件。

如何使用

  1. 选择 SVG 模式读取文件,或选择路径模式粘贴 d 属性中的路径数据。
  2. 从 SVG 中选择需要查看的路径,或检查独立路径是否有效。
  3. 设置填充颜色、描边颜色与粗细,并调整背景或缩放。
  4. 查看命令统计和几何边界,按需下载 path-preview.svg。

功能说明

  • 支持 M、L、H、V、C、S、Q、T、A 和 Z 等路径命令。
  • 显示路径命令统计与几何边界,无效路径会提示具体问题。
  • 预览可适应路径范围,并保留适量边距;下载包含所查看路径与选定样式。

Path 命令与边界说明

  • M 移动到起点;L、H、V 绘制直线;C、S 绘制三次曲线;Q、T 绘制二次曲线;A 绘制椭圆弧;Z 闭合当前子路径。小写命令通常使用相对坐标。
  • 边界针对路径的几何形状,不包含描边、标记、阴影或滤镜。完整 SVG 中的路径会参考上级图形变换,但单独查看不等同于原图的全部裁切和组合效果。
  • 很长的路径仍可查看统计,但详细命令列表只显示限定数量,避免页面因大量条目变慢。

SVG 安全说明

预览使用经过安全处理的静态副本,不运行脚本、点击事件或动画,也不加载外部图片、字体和样式。外部引用、内嵌网页和不支持的内容会被移除,因此预览可能与原文件不同。含 DOCTYPE 或自定义实体的文档不受支持。

SVG 文件或 UTF-8 源码最多 2 MiB,最多 20000 个节点(包括元素和文本),嵌套深度最多 96 层。内容过大或结构过于复杂时,请先简化文件。

隐私

SVG 内容仅在您的浏览器中处理,不会上传到服务器。

工具不会自动保存输入或结果。请在清空或离开页面前下载需要保留的文件,并保留原始副本。

FAQ

SVG Path 的 d 属性是什么?

d 属性保存路径命令与坐标,用来描述直线、曲线、圆弧和闭合轮廓。

M、L、C、Q、A 分别是什么?

M 移动起点,L 画直线,C 画三次贝塞尔曲线,Q 画二次贝塞尔曲线,A 画椭圆弧。

Z 是什么意思?

Z 将当前子路径闭合到该子路径的起点。一个 d 属性中可以有多个子路径。

Path Viewer 会执行 SVG 脚本吗?

不会。完整 SVG 会经过安全处理,独立路径预览只使用有效路径数据和所选的静态样式。

返回开发者工具分类首页