> 影像轉 Base64
將影像轉換為 Base64 Data URI — 適合嵌入程式碼中使用
🔒 你的影像永遠不會離開你的裝置。 所有處理都使用 FileReader API 在你的瀏覽器中進行。不上傳、不經伺服器、不追蹤。
功能特色
- Data URI 輸出 — 取得完整的 data:image/... URI 字串,可直接貼入 HTML、CSS 或 JavaScript。
- 一鍵複製 — 複製為原始 Data URI、<img> 標籤,或 CSS background-image 屬性。
- 大小比較 — 查看原始檔案大小與 Base64 字串長度的比較(Base64 約大 33%)。
- 即時轉換 — 轉換瞬間完成 — 不需要處理。
運作方式
- 上傳你的影像 — 拖放任何影像即可轉換為 Base64。
- 選擇複製格式 — 複製為 Data URI、<img> 標籤,或 CSS background-image。
- 貼入你的程式碼 — Base64 字串可直接將影像嵌入你的程式碼 — 不需要額外的檔案。
使用情境
- 在 HTML 中直接嵌入小影像以減少 HTTP 請求
- 在 HTML 電子郵件中內嵌影像,無需外部載入即可顯示
- 嵌入在樣式表中的 CSS 背景影像
- 將圖示打包在 JavaScript 程式碼中以進行單檔發佈
常見問題
什麼時候應該使用 Base64?
適用於小影像(10KB 以下) — 圖示、標誌、小型 UI 元素。嵌入可避免額外的 HTTP 請求。對於較大的影像,作為獨立檔案提供會更好。
為什麼 Base64 字串比檔案大?
Base64 編碼會增加約 33% 的大小,因為它將二進位資料轉換為 ASCII 文字。這是為了能在程式碼中直接嵌入影像的取捨。
完整的影像品質會保留嗎?
是的。Base64 只是相同二進位資料的不同編碼方式 — 完全不會損失品質。