Base64 圖片轉換器

免費線上 Base64 圖片轉換工具，支援圖片轉 Base64 編碼和 Base64 字串轉圖片。拖放上傳、即時預覽、一鍵複製。

立即使用Base64 圖片轉換器（免費、免註冊）

「圖片轉 Base64」把 JPG、PNG、GIF、WebP 或 SVG 拖進來，立刻得到 data:image 開頭的完整字串，可複製或存成 .txt；「Base64 轉圖片」貼上字串（有沒有 data:image 前綴都可以）就顯示預覽，依內容自動認出格式，下載成正確副檔名的圖片檔。全部在瀏覽器處理，圖片不上傳。

轉出來的字串怎麼用

圖片轉 Base64 的結果一律是完整的 Data URL，前面帶著格式，例如 data:image/png;base64,…，可以直接放進網頁原始碼：

HTML：直接當圖片網址

<img src="data:image/png;base64,iVBOR…"
     alt="圖示">

CSS：當背景圖

.icon {
  background-image: url(
    "data:image/png;base64,iVBOR…"
  );
}

很多 API（例如上傳圖片給後端、送去影像辨識）只要純 Base64，不要前面的說明文字。這時把第一個逗號之前（含逗號）刪掉，只留後面那段：

去掉 data: 前綴

完整：data:image/png;base64,iVBOR…
純 Base64：iVBOR…

字串會比原圖大多少

Base64 用 4 個文字表示 3 個位元組，所以字串一定比原檔大三分之一左右，再加上 data:image 的前綴。結果下方的「字串長度」就是整串的大小：

PNG 圖片轉成 Data URL 的長度
原圖大小字串長度多出
1 KB 小圖示1,390 字元+36%
10 KB 按鈕圖13,678 字元+34%
100 KB 照片縮圖136,558 字元+33%
1 MB 照片1,398,126 字元+33%

嵌在網頁裡的 Base64 圖片不能被瀏覽器分開快取，每次載入網頁都要重新下載一次，所以適合幾 KB 的小圖示、單頁小工具或寄送簡單的 HTML 檔；照片這類大圖放成一般圖片檔反而比較快。要先縮小檔案，可以用站上的圖片壓縮或圖片調整尺寸，再來轉 Base64。

Base64 轉圖片：怎麼認格式

貼上的字串會先解碼，再看資料最前面的「檔頭」判斷是哪種圖片，跟 data:image 前綴寫什麼無關——前綴寫錯（例如寫 png、其實是 JPEG），也會存成正確的副檔名。常見格式的 Base64 開頭一看就認得：

Base64 開頭與圖片格式
開頭字元格式工具判斷
iVBORw0KGgPNGimage/png
/9j/JPEGimage/jpeg
R0lGOGIFimage/gif
UklGRWebPimage/webp
QkBMPimage/bmp
PHN2ZSVGimage/svg+xml
PD94bSVG（<?xml 開頭）image/svg+xml

ICO 也認得；認不出檔頭但前綴寫明是 image/…（例如 AVIF）時照前綴。

  • 可以有空白與換行：從信件或程式碼複製、中間被斷行的字串也能直接貼。
  • 網址安全寫法也收：用 - 和 _ 取代 + 和 /、結尾沒有 = 的寫法（網址參數裡常見）也能解。
  • 有錯會講原因：預覽區上方會說是哪一個字元不對，或長度不對（多半是複製時被截斷）。

例如這段 1×1 的 GIF（前面沒有 data:image、中間還斷了行）：

貼上後的結果：當成 image/gif，下載 image.gif

R0lGODlhAQABAIAAAAAAAP///yH5
BAEAAAAALAAAAAABAAEAAAIBRAA7

貼上時常見的錯誤訊息

貼了什麼、工具怎麼說
貼上的內容工具的回應
文字的 Base64（5L2g5aW9，是「你好」）解得出來，但內容不是圖片（認不出 PNG、JPEG、GIF、WebP、BMP、ICO、SVG 的檔頭）
PNG 字串被截斷，只剩 9 個字長度不對（少了或多了字元），可能複製時被截斷
中間混進 # 號第 9 個字「#」不是 Base64 會出現的字元
同時有 + 和 -同時出現 + / 和 - _，不是有效的 Base64（兩種寫法不能混用）

文字、PDF 等不是圖片的 Base64，請改用站上的 Base64 編碼解碼工具（有文字與檔案分頁）。

限制與隱私

  • 一次一張：圖片轉 Base64 一次處理一張；切換上方兩個分頁時，畫面上的內容會清空。
  • 可上傳的格式：圖片轉 Base64 收 JPG、PNG、GIF、WebP、SVG；BMP、ICO 可以在「Base64 轉圖片」解回來，但不能從這裡轉出去。
  • 不會先幫你壓縮：字串就是原檔的完整內容，大小、畫質都不變；檔案很大時字串很長，複製或貼上會比較慢。
  • 隱私：讀檔、編碼與解碼都在你的瀏覽器裡完成，不會上傳到伺服器，也不用登入。

Base64 圖片轉換器功能特點

  • 圖片轉 Base64 編碼（含 data:image 前綴）
  • Base64 轉圖片：有沒有 data:image 前綴都可以，可下載成圖片檔
  • 即時預覽，顯示圖片格式與大小
  • 一鍵複製或下載成文字檔

如何使用Base64 圖片轉換器？

  1. 選擇轉換方向
  2. 上傳圖片或貼上 Base64
  3. 查看結果，複製 Base64 或下載圖片

Base64 圖片轉換器常見問題

什麼是 Base64 圖片編碼？

Base64 是一種將二進位資料轉換為純文字的編碼方式，可直接嵌入 HTML/CSS 中。

Base64 編碼會增加檔案大小嗎？

是的，Base64 編碼後約增加 33% 大小，建議只對小型圖片使用。

Base64 圖片適合用在哪裡？

適合小型圖標、CSS 背景圖、單一檔案的 HTML 頁面。Email 內文不一定顯示（不少網頁版信箱會擋 data: 開頭的圖片），寄出前請先寄給自己測試；大型圖片建議用一般的圖片連結，以免頁面載入變慢。

Base64 圖片有大小限制嗎？

技術上沒有硬性限制，但建議將 Base64 圖片控制在 10KB 以內。過大的 Base64 字串會顯著增加 HTML/CSS 檔案大小，影響頁面載入速度。

如何在 HTML 中使用 Base64 圖片？

在 HTML 的 img 標籤中，將 src 屬性設為 data:image/png;base64, 加上 Base64 編碼字串即可。例如：<img src='data:image/png;base64,iVBOR...' />

API 要的 Base64 不要 data:image 開頭怎麼辦？

複製結果後，把開頭到第一個逗號（例如 data:image/png;base64,）整段刪掉，剩下的就是純 Base64。反過來，拿到沒有前綴的純 Base64 要看圖，直接貼到「Base64 轉圖片」就好，工具會自己認格式。

貼上 Base64 顯示「長度不對」是什麼意思？

Base64 每 4 個字元一組，長度除以 4 餘 1 的字串不可能是完整的 Base64，通常是複製時少複製了一段或被截斷。請回到來源重新完整複製（很長的字串可以用「全選」再複製），貼上時中間的換行與空白不影響。

Base64 圖片放進 Email 內文會顯示嗎？

不一定。有些郵件軟體（特別是網頁版信箱）會擋掉 data: 開頭的內嵌圖片，收件人只看到空白或破圖。電子報、正式信件建議把圖片放在網路上用網址引用，或改用附件；真的要用 Base64，寄出前先寄給自己，用幾種常用的信箱與手機 App 看一次。

為什麼下載的圖片副檔名跟前綴寫的不一樣？

工具是看解碼後資料的檔頭判斷格式，不是相信前綴寫的字。例如前綴寫 image/png、內容其實是 JPEG，就會存成 .jpg——這樣圖片檔才打得開、副檔名也對。