导入 / 新建
100%
画布 800 × 500
×
画布是空的
选择上方工具栏中的绘图工具开始绘制,
或从上方「导入 / 新建」打开 SVG 文件 / 粘贴代码
或从上方「导入 / 新建」打开 SVG 文件 / 粘贴代码
拖拽绘制 · 点击选中 · 拖拽移动 · 滚轮 / +− 缩放 · 空格 / 中键 / 拖空白处平移 · 0 复位视图
快捷键
V 选择 · R 矩形 · C 圆形 · E 椭圆 · T 文字 · G 多边形 · O 星形 · L 线条 · P 手绘 · X 橡皮擦
Del 删除 · Ctrl+Z 撤销 · Ctrl+Y 重做 · Ctrl+D 复制 · 方向键 微调 · 空格+拖拽 平移
SVG 代码预览
0 行
导出
常见问题(FAQ)
SVG 编辑器可以做什么?
可绘制矩形、圆形、椭圆、线条、多边形、星形与手绘路径,添加文字并实时编辑 SVG 代码,导出 PNG / SVG 文件。
适合谁使用?
适合前端开发者与设计师快速生成、调试矢量图形,所见即所得,无需安装软件。
支持导入已有 SVG 文件吗?
支持。可直接打开本地 .svg 文件或粘贴 SVG 代码进行编辑。
导出 PNG 会失真吗?
PNG 导出按当前画布尺寸渲染,缩放后绘制可保持清晰;SVG 为矢量格式,任意缩放不失真。
SVG 和 PNG 有什么区别?
SVG 是矢量格式,缩放无损、体积小,适合图标与网页;PNG 是位图,适合复杂渐变与照片类图形。
参考资料
- SVG 规范 — W3C:https://www.w3.org/TR/SVG2/
- SVG 元素参考 — MDN:https://developer.mozilla.org/zh-CN/docs/Web/SVG/Element