SVG 轉 PNG

向量變畫素是單行道,所以尺寸要選好。

不上傳任何檔案

把檔案拖進來,或點擊選擇

支援 SVG。沒有大小上限,不用註冊。

    SVG 用數學描述形狀,所以放到多大都銳利。PNG 是固定的畫素網格。轉換等於把解析度定死 —— 這也是為什麼「用多大尺寸光柵化」是這一頁最重要的決定。

    為什麼要放棄向量

    因為很多軟體讀不了 SVG。簡報工具、舊版文書軟體、印刷上傳表單、電商商品上傳器、社群平台、大多數修圖軟體,都預期收到點陣影像。有些系統還會刻意拒收 SVG,因為 SVG 本質是 XML,可以夾帶指令碼。

    最後這點是真正的資安考量,不只是不方便:SVG 是一份「會動的文件」,PNG 是「不會動的資料」。轉換有時候是規定,不是繞路。

    解析度是你無法回頭的那個決定

    光柵化會丟掉數學描述、只留下畫素。之後把產出的 PNG 放大會糊掉,因為細節已經不再被任何地方描述。請用你可能會需要的最大尺寸來光柵化。

    我們會讀取 SVG 裡宣告的寬高,並且最長邊至少渲染到 1024 畫素 —— 宣告尺寸很小的會被放大,而不是產出一張迷你模糊圖。完全沒有宣告尺寸的 SVG 則以合理的正方形預設值渲染。

    透明度與字型

    沒有填色的區域在 PNG 裡維持透明,因為 PNG 帶完整的 alpha 通道。這正是 icon 和 logo 該選 PNG 而不是 JPG 的原因。

    文字是常見的意外。SVG 如果是用字型「名稱」引用字型,就依賴渲染當下那個字型存在。字型沒安裝,瀏覽器會替換成別的,而你的 PNG 會永久留下那個替代字型。匯出前先在向量軟體裡把文字轉成外框,可以完全避免這件事。

    由你自己的瀏覽器渲染

    你的瀏覽器本身就是很好的 SVG 渲染器,所以工作交給它。結果會被擷取到 canvas,透過 WebAssembly 編成 PNG,再用 oxipng 最佳化,然後才給你下載。

    全程沒有任何上傳。既然 SVG 可以夾帶指令碼,把檔案留在本機而不是丟到陌生人的伺服器上,是實質差異,不只是行銷話術。

    常見問題

    PNG 的解析度會是多少?

    我們採用 SVG 裡宣告的寬高,並且最長邊至少渲染到 1024 畫素,避免宣告尺寸太小而產出模糊的圖。

    可以把 PNG 轉回 SVG 嗎?

    沒有實質意義。光柵化是單向的 —— 形狀的數學描述已經沒了。描邊工具可以近似出輪廓,但不會重建出原始檔案。

    透明背景會保留嗎?

    會。沒有填色的區域維持透明,因為 PNG 有完整的 alpha 通道。

    我的文字在 PNG 裡跑掉了,為什麼?

    因為 SVG 引用了一個渲染當下不存在的字型,瀏覽器換成了別的。匯出前先在向量軟體裡把文字轉成外框。

    我的 SVG 會被上傳嗎?

    不會。由你的瀏覽器在本機渲染。這件事對 SVG 比一般格式更重要,因為這個格式可以夾帶指令碼。

    其他工具