SVG 代码编辑器

在线编辑 SVG 代码，实时预览效果，支持快捷设置和优化

点击或拖拽 SVG 文件到此处上传

支持 .svg 格式，也可使用 Ctrl+V 粘贴 SVG 代码

SVG 代码

0 字符 0 行 0 KB

实时预览

-

👈 在左侧输入 SVG 代码

预览将实时显示在这里

编辑元素

100%
2
100%

功能简介

SVG 代码编辑器提供实时预览和代码编辑功能，帮助你快速创建和调整 SVG 图形。

主要功能

  • 实时预览 - 左侧编辑代码，右侧即时显示效果
  • 文件上传 - 支持上传本地 SVG 文件进行编辑
  • 快捷设置 - 快速调整 SVG 的宽高、ViewBox、颜色等属性
  • 代码格式化 - 自动格式化 SVG 代码，提高可读性
  • 代码压缩 - 移除空格和换行，减小文件体积
  • 一键复制 - 快速复制编辑后的 SVG 代码
  • 下载导出 - 将编辑好的 SVG 保存为文件
  • 图片导出 - 支持导出静态 PNG

使用技巧

  • 使用快捷设置可以快速修改 SVG 的基本属性
  • ViewBox 格式为 "x y width height"，例如 "0 0 100 100"
  • 格式化功能会自动添加缩进，方便阅读和编辑
  • 压缩功能适合在生产环境中使用，可减小文件大小
  • 支持拖拽文件到编辑器区域快速上传