在瀏覽器中將 SVG 轉換為 JPEG(JPG)

更新於

在瀏覽器中將 SVG 轉換為 JPEG(JPG)

在支援瀏覽器操作的轉換工具中開啟你的 SVG,選擇需要的像素尺寸,然後匯出為 JPEG。由於 SVG 是向量格式,轉換的過程其實是點陣化:你選擇的尺寸決定了畫面的清晰度。檔案會直接在你的裝置上處理,不會上傳到任何地方。

現在就做——免費,在瀏覽器裡

Convert SVG to JPG free

如何將 SVG 轉換成 JPEG

SVG 是一組繪圖指令,不是像素圖,所以很多上傳表單、CMS 欄位和電子郵件用戶端都不接受它。轉換成 JPEG 能讓你得到普遍通用的相片格式。透過EditItAll 的免費 SVG 轉 JPG 工具,整個流程都直接在你的裝置上處理,不會上傳任何檔案,而且頁面載入後,離線也能繼續使用。

  1. 開啟轉換工具,拖曳你的 .svg 檔案進去,一次丟一整批也可以。
  2. 設定輸出的像素尺寸,這一步決定了清晰度。
  3. 選擇 JPEG 品質等級;數值越高保留的細節越多,數值越低檔案越小。
  4. 下載完成的 .jpg,或把整批打包成 ZIP 一起下載。

點陣化時,畫質就是解析度

把向量圖轉換成點陣格式,就是點陣化:轉換工具會依照你選擇的像素尺寸,重新繪製你的圖稿。這和壓縮相片不同,並沒有固定的原始解析度需要保留,尺寸完全由你決定,這也讓尺寸的選擇成為真正的畫質關鍵:

  • 對齊用途:1200px 寬的部落格橫幅圖片,需要 1200px 的 JPEG。
  • 要用在高解析度(Retina)螢幕嗎?請以顯示尺寸的 2 倍匯出。
  • 不確定的話,尺寸就抓大一點,向量來源不管畫多大都不會有任何損失。

好奇這兩種格式儲存圖片的方式差在哪裡?可以參考SVG 格式介紹頁JPG 格式介紹頁

JPEG 或 PNG:選擇正確的目標格式

如果圖稿包含相片質感或柔和漸層、你需要最小的檔案,或是表單只接受 .jpg,這時候 JPEG 就是正確的選擇。但 JPEG 不支援透明:SVG 中任何透明區域都會被填上單一色塊,而且強力壓縮還可能讓原本銳利的色塊邊緣變得模糊。

如果你需要透明背景或是像素級銳利的標誌邊緣,請改用 PNG:可以用SVG 轉 PNG,或參考將 SVG 轉成 PNG 且不損失畫質這篇指南。若是用在網頁上,SVG 轉 WebP的檔案大小通常比同樣視覺品質的 JPEG 更小。

匯出前先修正圖稿

因為整個轉換都在你的裝置上完成,反覆調整不會有任何成本。如果 SVG 需要先做點調整(改個形狀顏色、修正標籤文字、調整版面),可以打開免費向量編輯器進行修改,再重新匯出一次。在瀏覽器編輯 SVG 檔案這篇指南涵蓋了基本操作,而所有影像工具都遵守同一個原則:你的檔案永遠不會離開你的裝置。

現在就試試?

免費、無需註冊,你開啟的檔案絕不會離開你的裝置。

常見問題

把 SVG 轉成 JPEG 會不會影響畫質?+

向量圖本身沒有東西可以損失,轉換工具會依照你選擇的尺寸重新繪製。選擇夠大的像素尺寸和較高的 JPEG 品質設定,成果就會維持清晰;如果選了很小的尺寸,放大後就會顯得模糊。

為什麼我的透明背景變成白色了?+

JPEG 無法儲存透明度,所以轉換時任何透明區域都必須填上單一顏色。如果背景很重要,請改用 PNG,它會保留 Alpha 色版。

轉換客戶的標誌或尚未公開的作品安全嗎?+

安全。整個轉換過程完全在你的瀏覽器裡進行:SVG 會直接在你的裝置上處理,不會上傳到伺服器。頁面載入完成後,甚至可以離線使用。

JPEG 應該選擇多大的像素尺寸?+

先想清楚圖片最終會用在哪裡,再回推需要的尺寸。一般螢幕就用實際顯示的寬度,高解析度(Retina)螢幕則要加倍,不確定的話就選大一點,向量圖不管畫多大都不會有任何損失。

之後可以把 JPEG 轉回 SVG 嗎?+

沒辦法自動完成:JPEG 只是一堆像素組成的圖片,沒有任何形狀資訊,而且 EditItAll 不提供點陣轉向量的描圖功能。請把原始的 SVG 保留作為主檔案,之後需要 JPEG 時,隨時可以從它匯出。

相關指南

更多「轉換圖片格式」指南 →