ByteScope

Image ↔ Base64 Converter

批次將圖片轉為 Base64 data URI — 也能把 Base64 解碼回圖片。

檔案不會離開你的瀏覽器 — 全部在本機處理。

Drop images here

or click to browse — you can also paste images (Ctrl+V) anywhere on this page

note: base64 output is ≈ +33% larger than the original file — great for small icons, wasteful for large photos.

關於這個工具

這個轉換器能把圖片檔轉成 Base64 字串,直接嵌進 HTML、CSS、JSON 或程式碼裡 — 也能把 Base64 字串還原成可下載的圖片。拖放、瀏覽或貼上任意數量的圖片,每張都會產生一張卡片,附四種可直接複製的格式:原始 Base64 內容、完整的 data: URI、HTML <img> 標籤,以及 CSS background-image 規則。

解碼一樣寬容:不論貼上的是含或不含 data URI 前綴的原始 Base64、被斷行切開的字串,還是一次貼好幾段 — 工具都會自動拆分、從 magic bytes 偵測實際的圖片格式,並提供預覽和下載按鈕。

常見問題

我的圖片會被上傳到伺服器嗎?
不會。轉換完全在你的瀏覽器中以 JavaScript 執行 — 檔案不會離開你的裝置。頁面載入後甚至可以離線使用。
為什麼 Base64 輸出比我的圖片還大?
Base64 把每 3 個位元組的二進位資料表示成 4 個文字字元,所以輸出永遠比原始檔大約 33%。這是為了能把二進位資料嵌入 HTML、CSS 或 JSON 等文字格式所付出的大小代價。
什麼時候該用 Base64 data URI 而不是圖片檔?
Data URI 適合小圖(圖示、logo、幾 KB 以內的小預覽圖),當省下一次 HTTP 請求比檔案大小更重要時。對於大型照片,一般的圖片 URL 幾乎總是更好 — 它可以獨立快取,也不會讓你的 HTML 或 CSS 膨脹。
支援哪些圖片格式?
只要你的瀏覽器能讀取的都支援:PNG、JPEG、GIF、WebP、SVG、BMP、ICO 和 AVIF。解碼時會從檔案的 magic bytes 自動偵測格式,所以你不需要知道 Base64 裡裝的是什麼。
可以一次轉換多張圖片嗎?
可以 — 拖放或貼上任意數量的圖片,每張都會有自己的卡片和複製選項。你也可以一次貼上多段 Base64 或 data URI,它們會自動被拆分並解碼。