SVG 轉 WebP 轉換器

將向量檔算繪成 WebP，寬度剛好符合版面需要的像素數。適用於 CMS 不接受上傳 SVG、社群預覽圖需要點陣圖，或插圖路徑多到瀏覽器繪製緩慢的情況。

或將JPG, JPEG, JPE … 檔案拖曳到這裡 ·

每個檔案最大 95 MB· 最多 20 個檔案· 30 分鐘後刪除

輸出

轉換為

檔案會在我們的伺服器上處理，並於 30 分鐘後刪除。

使用方式

1
上傳 SVG
最多可加入 20 個從 Figma、Illustrator、Inkscape 或圖表函式庫匯出的 .svg 檔案，每個最大 95 MB。
2
設定輸出寬度
調整輸出圖片尺寸預設寬度為 1200 px；請改成圖片在頁面上所佔寬度的兩倍。品質預設為 90，若是色塊單純的標誌與圖示，可在進階設定中勾選無損。
3
轉換為 WebP
按下轉換為 WebP，即可下載個別檔案或單一 ZIP。透明區域會維持透明。

解答

如何將 SVG 轉成指定尺寸的 WebP？

上傳 SVG，將調整輸出圖片尺寸設為所需的像素寬度（預設 1200 px），然後按下轉換為 WebP。向量圖會直接以該寬度重新繪製，因此不會有放大或模糊的問題。

什麼時候該把 SVG 轉成 WebP

SVG 於 2001 年成為 W3C 建議標準，是多數標誌與圖示的最佳格式：只有幾 KB 的文字，任何縮放比例都清晰。問題出在檔案離開你自己的程式碼之後。WordPress 與許多代管的開店平台不接受 SVG 上傳，Facebook、LinkedIn 和 X 的連結預覽是以點陣圖擷取，而設計工具匯出的插圖常內嵌點陣特效，讓向量檔變成好幾 MB 的標記碼。

WebP 由 Google 於 2010 年推出，Safari 直到 2020 年的 14 版才支援，是專為這種情況設計的點陣圖：外觀相同時比 PNG 更小，且具備真正的 Alpha 通道。直接把 SVG 以最終尺寸轉成 WebP，可省下先匯出大型 PNG 的繞路。若你需要反向轉換，請參考我們的 WebP 轉 SVG 頁面，了解為何那個方向需要描圖而非轉檔。

常見網頁版位的 SVG 轉 WebP 尺寸

40:21

1200 × 630 px

Open Graph 連結預覽圖

頁面被分享時顯示的圖片

16:9

1920 × 1080 px

滿版主視覺插圖

以 1 倍可涵蓋多數桌機螢幕

16:9

1600 × 900 px

部落格欄位圖片（2 倍）

適用於 800 px 的內容欄位

4:1

400 × 100 px

頁首標誌（2 倍）

適用於 200 × 50 px 的標誌位置

SVG

可縮放向量圖形（SVG）

SVG 是 W3C 於 2001 年標準化、以 XML 為基礎的向量格式。它描述的是形狀、路徑和文字而非像素，因此任何尺寸都保持清晰，用於標誌和圖示時檔案通常非常小。它支援透明度、CSS 樣式、指令碼和動畫，所有瀏覽器都能原生顯示。SVG 不適合照片，複雜的插圖也可能繪製得很慢。Illustrator、Inkscape、Figma 和瀏覽器都能開啟與編輯。

壓縮方式: –
透明度: 支援
動畫: 支援
推出年份: 2001 · W3C

SVG 轉檔工具

WEBP

WebP 圖片

WebP 是 Google 於 2010 年推出的圖片格式，目的是讓網頁載入更快。它在同一種格式中同時支援有損與無損壓縮、Alpha 透明度與動畫。在視覺品質相近時，有損 WebP 檔案通常比 JPEG 小 25–35%，無損 WebP 通常也比 PNG 小。目前所有主流瀏覽器都支援，但部分較舊的桌面軟體、列印服務與上傳表單仍然不接受。Windows、macOS 與多數新型圖片編輯軟體都能開啟 WebP 檔案。

壓縮方式: 有損或無損
透明度: 支援
動畫: 支援
推出年份: 2010 · Google

WEBP 轉檔工具

人們把 SVG 轉成 WebP，是為了得到輕量、尺寸固定的點陣圖，用在不接受向量檔或繪製速度緩慢的地方，例如 CMS、社群預覽圖或負載繁重的登陸頁；WebP 轉 SVG 則是描圖作業，不是單純換格式。

SVG 如何點陣化，以及需要檢查的地方

轉換器會讀取 SVG 本身的 width、height 與 viewBox，再以你設定的寬度繪製每一條路徑；高度依長寬比自動決定。由於是在最終尺寸下繪製，細線與小字只會在正確的比例下做一次抗鋸齒。事後再放大小張 PNG，效果永遠不會一樣乾淨。

字型是常見的意外來源。若 SVG 指定的字型沒有內嵌或轉成外框，就會使用替代字型，行長也會改變。匯出前請先在設計工具中將文字轉外框。SVG 內以網址連結的外部圖片不會被擷取，請先內嵌或將圖稿平面化。