SVG / 圖示
SVG Sprite 產生器：Symbol與圖示使用方式
拖曳多個SVG圖示以建立symbol sprite。清理標記、去除重複的檔名ID、保留viewBox，可選擇將填色轉換為currentColor，並下載sprite.svg。
SVG Sprite 產生器：Symbol與圖示使用方式: 放入一組SVG圖示，即可取得一個sprite檔案，每個圖示各有一個symbol，並附上使用該圖示的程式碼片段。程式碼、外部資源及任何不安全內容都會被移除；必要時會將尺寸轉換為viewBox，也可以將填色切換為currentColor，讓圖示跟隨文字顏色。 全程在瀏覽器中於本機執行，檔案不會上傳至伺服器。
- 分類
- 開發者工具
- 使用次數
- 在瀏覽器中
- 費用
- 免費・免註冊
- 可用狀態
- 可立即使用
全程在瀏覽器中執行
指令碼、事件處理常式、外部資源、嵌入圖片、文字和不支援的元素都會移除。基本的內嵌樣式會轉為呈現屬性。若缺少viewBox，會使用數值寬度和高度；每個缺少的尺寸會以24單位作為預設值。使用前請檢查每個預覽。
編輯SVG圖示符號與重複使用
SVG 2 規範了symbol與use元素及其viewBox行為：https://www.w3.org/TR/SVG2/struct.html#SymbolElement；https://www.w3.org/TR/SVG2/struct.html#UseElement
本機處理與繪製
每個圖示都會根據安全的SVG元素與屬性清單重新建立，因此指令碼、事件處理常式與外部資源無法存取此精靈圖。不包含第三方圖示集。SVG paint與currentColor的規範請見https://www.w3.org/TR/SVG2/painting.html。使用者須自行負責上傳圖示的授權。
使用方式
- 拖曳最多60個SVG圖示，每個檔案不得超過1 MB。
- 檢查清理後的預覽，並視需要將填色轉換為currentColor。
- 下載sprite，並選取圖示以複製其使用程式碼片段。
隱私與限制
您的SVG檔案會留在本機。此工具不會擷取嵌入的網址，也不會上傳圖示。
相關工具
常見問題
如何使用sprite？
先在頁面上的隱藏容器中插入一次SVG，再使用複製的內嵌程式碼片段。若要使用獨立檔案，請改用sprite.svg#id作為href。
缺少viewBox時會發生什麼事？
數值型的寬度與高度，包括px單位，會用來定義新的viewBox。任何缺少或不支援的尺寸，預設為24單位。預覽會標示已修正的viewBox，方便您檢查是否有裁切。
每個圖示都會保留完全相同的外觀嗎？
不會。基本圖形、群組、漸層、裁切與遮罩會保留，但程式碼、文字、嵌入圖片、use元素及不支援的樣式都會被移除。請檢查預覽。您仍需自行負責所上傳作品的授權。
免費工具・使用在瀏覽器中次・免註冊