SVG 轉 PNG 線上轉換器 自訂像素尺寸、300 DPI 印刷級輸出與 100% 本機隱私保護

在瀏覽器本機將 SVG 向量檔案或 XML 原始碼無損光柵化為高畫質透明背景 PNG。檔案絕不上傳伺服器,支援任意像素寬高設定與商業印刷解析度寫入。

100% 瀏覽器本機處理 — 檔案絕不上傳伺服器,保障絕對隱私

將您的 SVG 檔案拖放到此處

或點擊瀏覽

自訂輸出像素寬高(選填): ×
常用尺寸預設:
精選實測效果展示

SVG 轉 PNG 真實渲染效果展示

檢視不同向量路徑、漸層色彩與透明通道在多倍放大及 300 DPI 印刷設定下的實際輸出品質。

4倍超清放大 (1024×1024 px) #01

應用程式圖示 SVG 轉高畫質透明 PNG

原始輸入
SVG 向量原始檔 (3.8 KB, viewBox="0 0 256 256")
輸出結果
32位元透明背景 PNG (1024×1024 px, 31.4 KB, 72 DPI)

在向量數學座標空間直接放大 4 倍後再進行畫布光柵化。貝茲曲線邊緣銳利無鋸齒,完整保留 8 位元 Alpha 半透明抗鋸齒通道,無論疊加在深色或淺色介面上皆平滑自然。

300 DPI 商業印刷級 (2400×3000 px) #02

品牌主視覺向量圖轉高精細印刷素材

原始輸入
SVG 印刷畫板 (14.2 KB, viewBox="0 0 800 1000")
輸出結果
高解析度印刷 PNG (2400×3000 px, 186.5 KB, 含 300 DPI pHYs 中繼資料)

以 2400×3000 像素(對應 8×10 英吋 @ 300 DPI)精準渲染,並在 PNG 標頭寫入標準 pHYs 物理像素密度區塊(11,811 像素/公尺),匯入 InDesign 或印刷排版軟體即可自動對應實際物理尺寸。

自訂社群橫幅 (1200×630 px) #03

內聯 SVG 架構圖原始碼轉純白底高畫質圖檔

原始輸入
內聯 <svg> XML 程式碼片段 (6.1 KB, 原生透明)
輸出結果
純白背景 PNG (1200×630 px, 42.8 KB, #FFFFFF 填滿)

直接透過「貼上 SVG 原始碼」分頁載入網頁元件中的內聯程式碼,並合成純白(#FFFFFF)背景層,徹底解決透明圖表在深色模式通訊軟體、Notion 或社群預覽卡中文字反黑難以閱讀的問題。

一、解決什麼具體問題

這款 SVG 轉 PNG 工具能解決哪些具體問題?

儘管 SVG 是網頁開發的最佳向量格式,但多數文書軟體、電商後台與印刷系統仍無法直接讀取 XML 向量檔。本工具在您的裝置本機提供無損轉換方案:

電商平台、社群媒體與 CMS 後台圖片上傳相容

蝦皮、Momo、Shopify 商品圖庫、Facebook/LinkedIn 橫幅以及多數部落格後台因資安防護限制禁止上傳 .svg 檔。只需數秒即可將向量標誌轉為完全相容的高畫質 PNG。

300 DPI 商業印刷、貼紙刀模與周邊商品打樣

一般瀏覽器另存圖片僅有 72 DPI 螢幕解析度,直接送印會導致邊緣模糊。透過自訂高像素寬高並寫入 300 DPI 中繼資料,可直接產生符合印刷廠規範的透明底大圖。

前端工程師與 UI 設計師的原始碼快速轉圖流程

從 React/Vue 專案或網頁原始碼複製出一段 <svg>...</svg> 標籤卻沒有獨立圖檔?無需另外開編輯器存檔,直接貼上程式碼即可即時渲染並下載指定尺寸的 PNG。

二、需要準備什麼輸入

轉換前需要準備什麼輸入檔案或資料?

為確保瀏覽器 HTML5 Canvas 引擎在光柵化時呈現正確比例與字型樣式,請確認您的 SVG 輸入符合以下技術條件:

標準 .svg 向量檔案或完整 <svg> XML 原始碼

支援拖曳上傳符合 SVG 1.1 / 2.0 規範的 .svg 檔案,或直接貼上以 <svg> 開頭、</svg> 結尾的 XML 程式碼。若為壓縮格式 .svgz,請先解壓縮為 .svg。

具備有效的 viewBox 或明確寬高屬性

根層級 <svg> 標籤應包含 viewBox="0 0 W H" 或明確的 width 與 height 屬性,讓解析器能精準計算原始長寬比與畫板範圍。

特殊字型需預先轉外框(建立外框路徑)

若 SVG 內含非系統預設的商業字型(<text> 標籤),請先在 Illustrator 或 Figma 中執行「文字轉外框 (Create Outlines)」,避免轉換時被替代為系統預設字型。

內嵌點陣圖需採用 Base64 編碼而非外部網址

受瀏覽器安全沙箱機制限制,SVG 內部以 http:// 連結引用的外部圖片會被阻擋;若有嵌入影像,請確認已轉為 data:image/png;base64 內聯格式。

三、具體操作步驟

SVG 轉 PNG 具體操作步驟

1

步驟一:上傳 SVG 檔案或貼上 SVG 原始碼

將一個或多個 .svg 檔案拖曳至上傳區(或點擊「載入範例 SVG」測試),亦可切換至「貼上 SVG 原始碼」分頁直接貼入 <svg> 程式碼。

2

步驟二:設定放大倍率、自訂像素或 300 DPI

選擇解析度倍率(1x 原始大小、2x Retina、4x 超高畫質),或在自訂尺寸欄位輸入精確的像素寬度與高度(可鎖定長寬比),並依需求選擇 72 / 150 / 300 DPI。

3

步驟三:選擇透明背景或自訂純色背景

預設維持「透明」以保留 32 位元 RGBA 透明通道;若目標平台不支援透明圖,可切換為純白、純黑或使用調色盤指定任意背景色。

4

步驟四:點擊開始轉換並下載 PNG 成品

點擊「開始轉換」按鈕,瀏覽器會立即於本機完成畫布渲染。您可單獨下載個別 PNG 檔案,或一鍵打包為 ZIP 壓縮檔下載。

四、產生結果怎麼用

產生的 PNG 圖片可以如何運用?

輸出的每個檔案皆為符合國際標準的無損 32 位元 RGBA PNG 圖檔,可直接應用於以下工作流程:

iOS / Android 應用程式開發與高解析度 UI 切圖

將輸出的 @2x、@3x 或 @4x 透明 PNG 圖示直接匯入 Xcode Assets、Android Studio Drawable 資料夾或遊戲引擎材質庫,確保高密度螢幕顯示清晰。

Word 報告、PowerPoint 簡報與 PDF 提案文件

解決舊版 Office、Google 簡報或 PDF 轉換器插入 SVG 時發生的線條跑位與漸層破圖問題,讓技術架構圖與品牌標誌在任何裝置上完美呈現。

商業印刷、壓克力立牌、貼紙與服飾直噴 (DTG)

具備 300 DPI pHYs 中繼資料的高像素透明 PNG 可直接交付給印刷廠製作刀模貼紙、T恤網版/直噴印刷及高解析度海報型錄。

五、哪些情況效果會不好(避坑指南)

哪些情況轉換效果會不好?(邊界情況與避坑指南)

瀏覽器本機渲染受限於作業系統字型庫與顯示卡記憶體上限,若遇到以下狀況請依對應方式修正:

轉換後的文字字體改變或變成系統預設明體/黑體

發生原因:

基於隱私與資安規範,瀏覽器的 SVG 影像渲染沙箱禁止在轉換過程中連線載入外部 @font-face 網頁字型。

解決方案:

請在設計軟體(Illustrator 按 Ctrl+Shift+O / Figma 按 Ctrl+E)中將所有文字圖層轉為向量路徑(外框)後再匯出 SVG。

輸出的 PNG 圖案被裁切、顯示不全或縮在角落

發生原因:

原始 SVG 程式碼缺少 viewBox 屬性,或圖形路徑座標超出了工作區域(Artboard)宣告的寬高邊界。

解決方案:

請先使用本站的「SVG 線上檢視器 (/svg-viewer/)」檢查邊界座標,或在根層級 <svg> 標籤補上正確的 viewBox="0 0 寬度 高度" 屬性。

設定極大像素尺寸(如超過 16,384 × 16,384 px)時匯出失敗

發生原因:

現代桌面與行動瀏覽器的 HTML5 <canvas> 顯示卡材質貼圖設有單邊 16,384 像素或總面積約 2.68 億像素的硬體記憶體保護上限。

解決方案:

請將目標像素寬高控制在 8192×8192 px 以內(一般 A3/海報 300 DPI 印刷僅需約 3500×4960 px 即可滿足)。

六、與相關工具有什麼區別

本工具與相關轉換工具有什麼區別?

比較「單檔精細 SVG 轉 PNG」與「批次轉換器」及「傳統雲端上傳工具」的差異,挑選最適合您工作流程的工具:

比較項目 / 場景 SVG 轉 PNG 轉換器(本工具) SVG 批次轉換器 (/batch-converter/) 傳統雲端伺服器轉換網站
主要工作流程定位 精確指定單一或少量檔案的像素寬高、貼上 SVG 原始碼轉換與寫入 300 DPI 印刷中繼資料 一次拖曳數十至數百個 SVG 圖示,高速批次轉為 PNG、JPG 或 WebP 並打包 ZIP 需將檔案上傳至遠端伺服器排隊處理,常有每日檔案數量與檔案大小限制
像素尺寸與 DPI 控制 支援自訂任意寬高像素 (px)、1x–4x 倍率預設,以及 72 / 150 / 300 DPI pHYs 標頭寫入 支援統一倍率縮放(1x、2x、4x)與自訂檔名前綴/後綴批次命名規則 多數僅固定輸出 72 DPI 螢幕解析度,無法自訂精確像素或物理印刷 DPI
直接貼上原始碼支援 內建「貼上 SVG 原始碼」編輯器,可直接渲染內聯 <svg> 標籤片段 僅支援檔案與資料夾拖曳上傳(專為大量圖示庫檔案設計) 極少支援,必須先手動儲存成 .svg 檔案才能上傳轉換
資料隱私與處理速度 100% 瀏覽器本機 Canvas 運算,0 位元組上傳,毫秒級即時產生 100% 本機多執行緒轉換並透過前端 JSZip 自動封裝 機密商業設計稿需上傳至第三方伺服器,有外洩風險與網路等待延遲
七、常見問題怎麼處理

常見問題與技術故障排除 (FAQ)

如何計算 300 DPI 印刷所需的精確 PNG 像素尺寸?

請套用標準印刷換算公式:物理英吋 × 300 = 目標像素(或:公釐 mm ÷ 25.4 × 300 = 目標像素)。舉例來說,若要印製一張 4×6 英吋的 300 DPI 高畫質貼紙,請在「自訂輸出像素寬高」輸入寬度 1200 px、高度 1800 px,並選擇「300 DPI(高畫質商業印刷標準)」。本工具會以精確像素格渲染並將 300 DPI pHYs 中繼資料寫入 PNG 檔案標頭。

將 SVG 放大 4 倍轉成 PNG 後,線條邊緣會模糊或起鋸齒嗎?

完全不會。不同於把點陣圖強行拉大,本轉換器是先在向量數學空間將 SVG 的貝茲曲線與座標放大至目標解析度,最後才在 HTML5 畫布上進行光柵化著色,因此無論輸出 512px 或 4096px,邊緣皆保持絕對銳利。

我上傳的企業商標或未公開設計圖會被傳送到伺服器嗎?

絕對不會。本工具 100% 採用前端 JavaScript 與瀏覽器原生 Canvas API 運作,所有檔案讀取、繪製與 PNG 編碼皆在您的電腦或手機記憶體內獨立完成,即使載入網頁後拔除網路線也能正常轉換。

為什麼轉出來的透明 PNG 在某些看圖軟體中背景看起來是白色或黑色?

部分作業系統內建預覽程式(如 Windows 相片檢視器或手機相簿)為了方便辨識,會在透明區域底層襯上純白或純黑底色。只要您在本工具中選擇「透明」背景並點擊「下載」,產生的即為標準 32 位元 RGBA 透明 PNG,匯入 Photoshop、Illustrator 或網頁即可呈現完整透明效果。

輸出的高解析度 PNG 檔案較大,該如何壓縮體積同時保留透明背景?

高畫質 32 位元 PNG 預設採用無損壓縮。下載完成後,您可點擊下方相關工具中的「PNG 線上壓縮工具 (/png-compressor/)」,在 100% 維持像素尺寸與 Alpha 半透明邊緣的前提下,減少 50%–75% 的檔案大小。

相關影像與向量工具推薦

每個工具專注解決單一明確需求,點擊下方卡片即可切換至對應工具。

分享此工具

幫助他人發現這個免費且私密的 SVG 轉 PNG 轉換器。