什麼是圖片轉Base64編碼？

圖片轉 Base64 編碼器可將圖片檔案（PNG、JPEG、GIF、SVG、WebP）轉換為 Base64 編碼的文字字串。可將圖片直接嵌入 HTML、CSS 或 JSON，無需另外托管檔案，減少 HTTP 請求，標記更簡潔。

編碼器在你的裝置上讀取圖像位元組，產生八種輸出：原始 Base64、適用於 src= 屬性的 data URI、完整的 <img> 標籤、CSS background-image 宣告、HTML 圖示連結、XML 包裝、使用 Image 的 JavaScript 程式碼片段，以及包含檔名、MIME 類型、大小和 data URI 的 JSON 物件。開啟「最佳化」可先縮小最長邊並重新編碼為 JPEG 或 WebP，在嵌入前將字串減半。一次拖放或貼上多張圖像，每張都有帶標籤的輸出。需要反向轉換？「將 Base64 解碼為圖像」部分能將任何字串轉回可檢視、可下載的圖片。支援格式：PNG、JPEG、GIF、SVG、WebP、BMP、ICO、AVIF 和 HEIC，每個最大 20 MB。

使用方法

1. 步驟 1 — 透過拖曳、點擊上傳區域或用 Ctrl+V 貼上來上傳圖像。若要先縮小，請開啟「編碼選項」並設定最大尺寸或品質。
2. 步驟 2 — 選擇輸出格式：原始 Base64、data URI、HTML img 標籤、CSS background-image、HTML 圖示連結、XML、使用 Image 的 JavaScript 程式碼片段，或用於 API 負載的 JSON 物件。
3. 第三步——將結果複製到剪貼簿或下載為文字檔。

何時使用

• 在 HTML 信件中嵌入小 logo 或圖示,讓收件人離線也能正常顯示。
• 把小型 SVG 圖示內聯進樣式表,省下一次會阻擋渲染的 HTTP 請求。
• 在不允許放 URL 的 JSON、JWT、YAML 設定中,把圖片以字串形式攜帶過去。

結果

您有一個 2KB 的 Logo 圖示，希望直接嵌入電子郵件範本中。上傳 PNG 檔案，複製資料 URI 輸出，將其貼入 HTML img 標籤的 src 屬性——無需任何外部托管。

常見問題

Base64 編碼後檔案會變大嗎?

會,大約增加 33%。Base64 用四個 ASCII 字元表示三個位元組,30 KB 的 PNG 編碼後約 40 KB 文字。只有檔案在 5 KB 以下,且能省掉一次 HTTP 請求時才划算。

什麼時候用 Base64 內聯,什麼時候直接用連結?

首屏出現、不容易快取的素材(例如使用者頭像、只用一次的小圖示)且容量在 4 至 5 KB 以下時適合內聯。跨頁面共用的圖檔要用連結,瀏覽器才能重複利用快取。

為什麼 data URI 開頭是 data:image/png;base64,?

這段是媒體類型聲明。data:image/png 告訴瀏覽器後面是 PNG,base64 表示編碼方式,逗號分隔標頭與資料。缺少這段資訊,解碼器無從判斷圖片格式。

可以把 Base64 再解碼回圖片觀看嗎?

可以。打開本頁的「把 Base64 解碼回圖片」區塊，貼上 data URI 或純 Base64，即可預覽圖像並下載。URL 安全的 Base64（用 - 和 _ 的那種）也支援。

SVG 值得用 Base64 編碼嗎?

多半不值得。SVG 本身就是文字,在 data URI 中直接做 URL 編碼會比 Base64 更短。工具仍保留 SVG 支援,主要用於需要一段可直接傳輸的字串時。

相關工具