Boxy SVG

Boxy SVG 是一款面向 macOS 以及其他现代操作系统的 SVG 矢量图形编辑工具，主要用于创建、编辑和优化 SVG 图形，同时也适合网页设计、图标制作、UI 设计以及 Web 开发等使用场景。软件采用简洁直观的编辑界面，并提供画布直接编辑对象几何形状、变换、填充和描边等属性的能力，支持矩形、圆形、椭圆、多边形、星形以及复杂路径等图形的创建和编辑。除了基础绘图功能外，Boxy SVG 还提供路径联合、相交、相减、排除、闭合等路径运算，以及对齐、旋转、翻转、排列、组合等对象操作，并支持渐变、滤镜、混合模式、裁剪路径和蒙版。对于 Web 开发者而言，它还提供类似 Chrome DevTools 的 SVG/CSS 代码检查器，并能够生成较为干净的 SVG 代码，同时保留对象 ID、class、title 等元数据。

功能特点

专注 SVG 矢量图形编辑

Boxy SVG 的核心功能围绕 SVG 展开，可以直接在画布上创建和编辑各种矢量对象，并对对象的几何结构、位置、尺寸、旋转、填充和描边等属性进行调整。

丰富的路径编辑功能

软件提供完整的路径编辑和布尔运算工具，包括联合、相交、相减、排除、闭合以及反转路径等操作，适合制作复杂图标、插画和矢量图形。

支持形状与自由路径设计

除了常用的矩形、圆形、椭圆等基础形状，还可以创建星形等特殊图形，并通过节点和路径工具进一步调整图形结构。

填充、描边与视觉效果

Boxy SVG 支持对对象进行填充和描边设置，同时提供渐变、滤镜、混合模式、裁剪路径和蒙版等功能，可以用于制作更加复杂的视觉效果。

灵活的对象排列工具

针对多个图形对象，软件提供对齐、旋转、翻转、排序以及组合等操作，可以快速整理画布中的设计元素，提高图形排版效率。

文本与字体设计

软件支持创建和编辑文字，并能够配合字体工具进行 SVG 文字设计。同时集成 Google Fonts，可以直接使用大量免费字体资源。

SVG 代码检查

Boxy SVG 针对 Web 开发者提供了类似 Chrome DevTools 的 SVG/CSS 代码检查器，可以在设计图形的同时查看和调整 SVG 代码，对于需要将 SVG 用于网页项目的用户尤其方便。

保留 SVG 元数据

导出的 SVG 不仅关注图形外观，还能够保留对象的 ID、class、title 以及其他相关元数据，这对于网页开发、SVG 图标系统和前端项目中的资源管理具有实际价值。

多种格式导入与导出

Boxy SVG 原生保存 SVG 和 SVGZ 文件，同时可以将设计作品导出为 PNG、JPEG/JPG、WebP、PDF、HTML 等格式，方便将 SVG 设计用于网页、图片素材以及其他设计项目。

网格与辅助线

软件提供普通网格、手动辅助线和智能辅助线，可以帮助用户更加准确地定位、排列和调整设计元素。

Pixabay 与在线素材资源

Boxy SVG 集成 Pixabay 等公共资源库，并提供图片、矢量素材、颜色方案和字体等资源，可以减少设计过程中频繁切换素材网站的需要。

键盘快捷键高度可配置

软件支持为 100 多项操作配置键盘快捷键，适合需要大量进行重复编辑操作的设计用户。

Boxy SVG 是什么？

Boxy SVG 是一款以 SVG 为核心的矢量图形编辑器，可以用于创建和编辑 SVG 图标、网页图形、插画、UI 素材以及其他矢量设计作品。

Boxy SVG 适合哪些用户？

它适合平面设计师、网页设计师、UI/UX 设计师、图标设计人员以及前端开发者。对于需要直接编辑 SVG 代码或希望保持 SVG 文件结构整洁的 Web 开发人员来说，软件还提供了专门的 SVG/CSS 检查功能。

Boxy SVG 和 Illustrator 有什么区别？

两者都可以用于矢量图形设计，但 Boxy SVG 的重点更加集中在 SVG 工作流程以及 Web 图形制作。它提供 SVG/CSS 代码检查、SVG 元数据保留以及 HTML 导出等与 Web 开发关系较密切的功能，而不是单纯面向传统印刷和综合图形设计场景。官网也明确表示其界面设计受到 Inkscape、Sketch 和 Adobe Illustrator 等工具的启发。

Boxy SVG 可以导出 PNG 和 WebP 吗？

可以。官方列出的导出格式包括 PNG、JPG/JPEG、WebP、PDF、HTML，以及 SVG 和 SVGZ 等格式。

Boxy SVG 可以编辑 SVG 代码吗？

可以。Boxy SVG 提供 SVG/CSS code inspector，可以查看 SVG 代码和相关 CSS 属性，并针对 Web 开发场景提供更加直接的 SVG 编辑能力。

Boxy SVG 是否适合网页设计？

适合。SVG 本身就是 Web 中常用的矢量图形格式，而 Boxy SVG 同时提供 SVG/CSS 检查、干净 SVG 输出、HTML 导出以及 SVG sprite 编辑等功能，因此可以用于网页图标、Logo、UI 图形和其他 Web 矢量素材制作。