Boxy SVG
SVG 是用于存储图标、横幅、图表和插图等矢量图形的标准格式。Boxy SVG 项目……
- macOS 12.0 or later, 64-bit processor
软件介绍
SVG 是用于存储图标、横幅、图表和插图等矢量图形的标准格式。Boxy SVG 项目的目标是为非技术人员以及专业设计师和开发者打造最佳的 SVG 编辑器。
核心功能：
• 简洁直观的用户界面，深受 Inkscape、Sketch 和 Adobe Illustrator 启发
• 全面支持在画布上直接编辑对象的几何属性、变换、填充及其他属性
• 支持保存为 SVG 和 SVGZ 格式，并可导出为 PNG、JPG、WebP、PDF 和 HTML5 格式
• 集成 Open Clip Art Library，提供数千种免费矢量素材
• 集成 Google Fonts，提供数百种免费字体
• 超过 100 个命令可自定义键盘快捷键
• 手动辅助线、智能辅助线与网格功能
• 路径运算（合并、相交、减去、排除、闭合、反转等）
• 排列操作（对齐、旋转、翻转、排序、组合等）
面向 Web 开发者：
• 基于 Chromium 的渲染引擎
• 类似 Chrome DevTools 的 SVG 与 CSS 代码检查器
• 输出干净的 SVG 代码，保留 ID、class、title 及其他元数据
• 支持 SVG 雪碧图（sprites）编辑
版本更新（4.111.0）：
• 新增：OpenMoji 图标库
• 新增：PNG/JPEG 导出时的「色彩空间」选项
• 修复：「连接路径」命令失效问题
系统要求：macOS 12.0 或更高版本，64 位处理器
截图
如果您正在使用广告拦截器，请将本网站加入白名单以支持我们！广告收入是我们为您提供优质内容的重要来源！或阅读此说明了解如何支持我们。谢谢！
大小：222.5MB
早期版本
编辑核对资料
推荐给前端工程师、设计系统维护者、图标/Logo 设计师和需要直接交付标准 SVG 的产品团队。采用“定义 viewBox/命名/可访问性规则 → 建立覆盖 symbol/use/filter/mask/font/foreignObject 的基准集 → 视觉绘制并同步检查 Elements/CSS → 锁定 ID/class → SVG lint/优化副本 → Safari/Chrome/Firefox + 实际组件回归 → 小尺寸/高对比/键盘与屏幕阅读器检查 → 保存原 SVG、优化 SVG、PNG 预览和 manifest”的流程。复杂 Boolean 与 Join Paths 始终保留操作前副本；开放式 Web 资产优先避免不必要 foreignObject 和不稳定外链。OpenMoji 等素材在入库时记录许可证/署名，位图导出固定 color space。复杂 UI/品牌系统可比较 Sketch；更强矢量插画可比较 Affinity Designer、Amadine、EazyDraw；若核心是 SVG 代码与 sprite，Boxy SVG 更合适。印刷 CMYK、专业排版或照片合成应转交对应工具。
优点
- 它围绕 SVG 本身而不是专有文档格式设计，画布与 SVG/CSS 结构检查器同步，适合既要视觉绘制又要控制 ID、class、symbol、title 和 metadata 的前端开发者、图标设计师与设计系统团队。基于 Chromium 的渲染能较早暴露浏览器相关问题；标准 SVG 可直接进 Git、代码审查、diff、sprite 与组件管线，降低格式锁定。路径布尔/排列、参考线/网格、渐变/滤镜/marker、sprite 编辑和可配置快捷键覆盖日常 Web 矢量工作。SVG/SVGZ 加 PNG/JPEG/WebP/PDF/HTML5 导出便于同一源文件服务代码、预览和交付；4.111.0 的色彩空间选项改善位图导出的可控性，OpenMoji 加快原型制作。多语言界面、Mac/网页/其他平台形态便于不同团队使用。对于以小型图标、Logo、插画、数据图形、Web 动画和 SVG 组件为主的工作，它比大型综合设计套件更直接。
不足
- 专注 SVG 也意味着它不是完整印刷排版、复杂多画板品牌系统、照片处理、RAW、专业 CMYK/专色或长文档工具；PNG/JPEG 色彩空间选项不能把浏览器式工作流变成印前色彩系统。Chromium 画布接近 Chrome，但 Safari/Firefox、邮件客户端、原生渲染器和 SVG 消毒器仍可能不同；开发者明确承认 use、foreignObject、外部引用等边界，不能把“编辑器显示正确”当交付证明。Google Fonts、Pixabay、OpenMoji 与在线导入会带来网络可用性、许可证、隐私和长期归档问题。复杂 filter、mask、动画和大量节点可能造成浏览器性能或可访问性问题。直接编辑 XML/CSS 很强，但误改 ID/class/href 会静默破坏网页脚本和样式；优化器也可能改变 DOM。与 Illustrator/Affinity/Sketch 相比，复杂插画、文字排版、插件、资产协作与客户交换生态较小。App Store 版本要求较新的 macOS；桌面、Web/PWA 与其他平台版本的文件系统、字体和 API 权限也不完全一致。
安装步骤
- Boxy SVG 4.111.0 的 Mac App Store 版本要求 macOS 12.0 或更高版本，可在 Intel 与 Apple silicon Mac 上使用。安装后先复制一组真实 SVG 建立兼容性样本：包含 viewBox/preserveAspectRatio、嵌套 transform、symbol/use、marker、mask、clipPath、filter、gradient、pattern、CSS class/ID、外部图片、Google Font、foreignObject、动画和 metadata。逐个在 Boxy SVG、Safari、Chrome、Firefox 以及最终嵌入页面对照，不能只看编辑器画布。创建新图标时先固定 viewBox、坐标精度、命名和无障碍 title/desc；用路径布尔运算前复制原对象，复杂 Join Paths 后检查方向、填充规则和开放子路径。导出 SVG/SVGZ 前检查是否保留 ID、class、title 和 metadata；网页交付尽量内嵌或打包外部资源。PNG/JPEG 导出明确选择色彩空间并用目标浏览器/应用核对；PDF、WebP、HTML5 也要单独验证字体、滤镜、透明和尺寸。
卸载步骤
- 卸载前把所有工作文件保留为标准 SVG，而不是只留 PNG/PDF；同时为最终版本保存 SVGZ、预览 PNG、网页实际使用的构建产物和浏览器截图。建立 manifest 记录 Boxy SVG 版本、viewBox、宽高、色彩空间、字体来源/授权、外部资源、ID/class/API 契约、sprite symbol 名称、动画/CSS/JS 依赖、优化器版本、SHA-256 和复核浏览器。若使用 Google Fonts、Pixabay、OpenMoji 或其他库，保存具体素材、许可证/署名要求与获取日期，不要把在线库链接当归档。对外部 href、image、font、CSS 进行离线测试；确认断网后 SVG 仍按预期渲染。对于组件/NPM 工作流，另存 package lock、config 与构建脚本。用另一浏览器和文本编辑器打开归档 SVG，确认 XML 可读、无损坏且没有只存在于应用内部的引用后再删除 App；账户/云端文件按各自策略处理，卸载不会自动删除远端副本。
常见报错及解决办法
- 同一 SVG 在编辑器和浏览器外观不同：开发者明确指出大量使用 use、foreignObject 或外部引用的少数文件可能存在差异；先把最小复现分别在 Safari/Chrome/Firefox 打开，检查命名空间、href/xlink:href、base URL、CORS、字体和 CSS。图标被裁切或缩放异常：核对 viewBox、width/height、preserveAspectRatio、transform origin 及超出边界的 filter；不要只扩大画板掩盖错误。Join Paths 后填充反转/洞消失：检查子路径方向、nonzero/evenodd fill-rule、开放端点和 transform，4.111.0 修复了命令失效，但不会替你决定拓扑。Google Font 转路径失败：确认字体已加载且浏览器允许 Local Font Access；交付前可以复制对象转路径，但保留原文字版。外部图片/字体离线消失：嵌入 data URI 或与 SVG 同包并改成稳定相对路径，检查服务端 MIME/CSP/CORS。PNG/JPEG 色差：4.111.0 新增 Color space 选项，明确选项后在目标应用复核，不把浏览器画布的显示配置当印刷色彩管理。动画/滤镜性能差：减少节点、模糊半径、filter region 与同时动画元素，用 Performance 工具测实际页面。代码优化破坏 CSS/JS：优化前锁定 ID/class，建立 DOM 与视觉回归。
本次版本更新内容
- Boxy SVG 4.111.0 官方版本记录列出三项变化：新增 OpenMoji 素材库；PNG/JPEG 导出新增“Color space”选项；修复 Join Paths 命令无法工作的问题。页面仅记录这三项明确变化，不把其他分支更新混入 4.111.0。应用以 SVG 为原生编辑格式，提供画布上的几何/变换/画笔控制、路径布尔与排列、手动/智能参考线、网格、SVG/CSS Elements 检查器、SVG sprite 编辑，并尽量保留 ID、class、title 和 metadata。可保存 SVG/SVGZ，导出 PNG、JPEG、WebP、PDF 与 HTML5；渲染基于 Chromium。Mac App Store 标明最低 macOS 12.0，提供简体中文、日文、韩文等多语言，隐私标签为开发者声明不收集数据。官方也说明没有编辑器能覆盖整个 SVG 标准，重度 use/foreignObject 或外部引用仍需跨浏览器验证。
同类替代软件
截图预览
