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 個指令皆可自訂鍵盤快速鍵
• 手動輔助線、智慧輔助線與網格功能
• 路徑運算（結合、相交、減去、排除、封閉、反轉等）
• 排列運算（對齊、旋轉、翻轉、排序、群組等）
針對網頁開發者：
• 採用 Chromium 搭載之渲染引擎
• 提供類似 Chrome Dev Tools 的 SVG 與 CSS 程式碼檢查器
• 輸出乾淨的 SVG 程式碼，完整保留 ID、class、title 及其他中繼資料
• 支援 SVG Sprite 圖片編輯
最新更新（版本 4.111.0）：
• 新增：OpenMoji 圖示圖庫
• 新增：PNG／JPEG 匯出時的「色彩空間」選項
• 修正：「連接路徑」指令無法正常運作的問題
系統需求：macOS 12.0 或更新版本，64 位元處理器
螢幕截圖
若您正在使用廣告攔截工具，請將本網站加入白名單以支持我們！廣告收入正是我們持續提供高品質內容的關鍵來源！或閱讀此說明，了解如何支持我們。謝謝您！
檔案大小：222.5MB
舊版下載
編輯核對資料
推薦給直接交付標準 SVG 的前端、design system 維護者、icon／Logo designer 與產品團隊。流程為「定義 viewBox／命名／accessibility → symbol／use／filter／mask／font／foreignObject fixture → 視覺編輯＋Elements／CSS audit → 鎖定 ID／class → 副本 lint／optimize → Safari／Chrome／Firefox＋實際 component regression → 小尺寸對比／keyboard／screen reader → 保存 source SVG、optimized SVG、PNG proof、manifest」。Boolean／Join Paths 前保留副本；公開 asset 避免不必要 foreignObject／不穩定外鏈。OpenMoji 等記錄 license／attribution，bitmap export 固定 color space。複雜 UI／品牌比較 Sketch，強矢量插畫比較 Affinity Designer／Amadine／EazyDraw；成果核心是 SVG markup／sprite 則 Boxy SVG 更合適。CMYK 印刷、專業排版、相片合成用專用工具。
優點
- 它以 SVG 本身而非專有文件為核心，canvas 與 SVG／CSS inspector 同步，適合需要視覺編輯並控制 ID、class、symbol、title、metadata 的前端、icon designer、design system 團隊。Chromium rendering 能提早暴露 browser behavior；標準 SVG 可直接進 Git、code review、diff、sprite、component pipeline，lock-in 較少。path Boolean／arrangement、guide／grid、gradient／filter／marker、sprite、shortcut 覆蓋日常 Web vector。SVG／SVGZ 加 PNG／JPEG／WebP／PDF／HTML5 輸出令同一 source 用於 code、preview、delivery；4.111.0 的 color space 與 OpenMoji 很實用。小型 icon、Logo、illustration、data graphic、Web animation、SVG component 比大型 suite 更直接。
不足
- 專注 SVG 代表它不是完整印刷排版、複雜 multi-artboard 品牌、相片／RAW、專業 CMYK／spot 或長文件工具；PNG／JPEG color space 不等於 prepress 色彩系統。Chromium canvas 接近 Chrome，但 Safari／Firefox、mail client、native renderer、sanitizer 仍不同；開發者亦承認 use、foreignObject、external reference 邊界。Google Fonts、Pixabay、OpenMoji／online import 帶來 availability、license、privacy、archive 問題。複雜 filter、mask、animation、多 node 會影響 performance／accessibility。XML／CSS 誤改 ID／class／href 或 optimizer 改 DOM 可靜默破壞 script／style。複雜 illustration、typography、plug-in、協作／交換生態小於 Illustrator／Affinity／Sketch；desktop／Web／PWA 的 filesystem、font、API permission 亦不同。
安裝步驟
- Boxy SVG 4.111.0 的 Mac App Store 版本要求 macOS 12.0 或以上，可於 Intel 與 Apple silicon Mac 使用。以真實 SVG 副本建立 fixture，涵蓋 viewBox／preserveAspectRatio、nested transform、symbol／use、marker、mask、clipPath、filter、gradient、pattern、CSS class／ID、外部圖片、Google Font、foreignObject、animation、metadata；逐一在 Boxy SVG、Safari、Chrome、Firefox 與實際 embed page 比較。新 icon 先固定 viewBox、座標精度、命名、無障礙 title／desc。Boolean 前複製原物件，複雜 Join Paths 後檢查方向、fill-rule、open subpath。SVG／SVGZ 輸出確認 ID、class、title、metadata 保留，外部 asset 應 embed／package。PNG／JPEG 明確選 color space；PDF／WebP／HTML5 另驗 font、filter、alpha、尺寸。
解除安裝步驟
- 移除前把所有可編輯原檔保留為標準 SVG，不可只留 PNG／PDF；另存 SVGZ、預覽 PNG、正式 Web artifact 與 browser reference capture。manifest 記錄 Boxy SVG 版本、viewBox、尺寸、color space、字型來源／授權、external resource、ID／class／API contract、sprite symbol、animation／CSS／JS dependency、optimizer 版本、SHA-256、已驗證 browser。Google Fonts、Pixabay、OpenMoji 等須保存實際 asset、license／attribution、取得日期，網址不是 archive。離線測 external href、image、font、CSS；component／NPM 另存 package lock、config、build script。用另一 browser／text editor 確認 SVG 是 readable valid XML 且沒有 app-only reference 後才移除。account／cloud 另行處理。
常見錯誤及解決方法
- 編輯器／browser 顯示不同時，開發者指出大量使用 use、foreignObject 或 external reference 的少數檔案可能有差異；以 Safari／Chrome／Firefox 最小重現檢查 namespace、href／xlink:href、base URL、CORS、字型、CSS。裁切／縮放核對 viewBox、width／height、preserveAspectRatio、transform origin、filter bounds。Join Paths 後填充／洞錯誤要檢查 subpath direction、nonzero／evenodd、open endpoint、transform；4.111.0 修正命令失效，不替代 topology 判斷。Google Font 轉 path 要確認載入／Local Font Access，只轉副本。外部圖片／字型應 embed 或相對路徑封裝並檢查 MIME／CSP／CORS。PNG／JPEG 使用新 Color space 並於目標驗證。animation／filter 太慢則減 node、blur、filter region；optimization 前鎖定 ID／class 並做 DOM／visual regression。
本次版本更新內容
- 官方 4.111.0 記錄只有三項：新增 OpenMoji library；PNG／JPEG export 新增 Color space 選項；修正 Join Paths 命令無法運作。此處不混入其他 branch。SVG 是 native 可編輯格式，提供 canvas geometry／transform／paint、path Boolean／arrangement、manual／smart guide、grid、SVG／CSS Elements inspector、SVG sprite，並盡量保留 ID、class、title、metadata。可存 SVG／SVGZ，匯出 PNG／JPEG／WebP／PDF／HTML5，採 Chromium-based rendering。Mac App Store 最低 macOS 12.0，提供簡中、日、韓等語言，privacy label 為開發者聲明不收集資料。開發者亦指沒有 editor 完整覆蓋 SVG standard，重度 use／foreignObject／external reference 仍要 cross-browser verification。
同類替代軟體
截圖預覽
