> 編碼 | 嵌入 | 最佳化 <
// 將圖片轉換為Base64字串,用於網頁開發和資料嵌入
🖼️
將圖片拖放到此處或點擊選擇
點擊瀏覽檔案
// 支援:PNG、JPEG、GIF、WebP、SVG
0 字元
[安全]
本地處理
100%客戶端圖片編碼。您的檔案永遠不會離開瀏覽器。
[快速]
拖放上傳
透過拖放介面快速上傳。瞬間Base64轉換。
[免費]
無限制
編碼任意大小或格式的圖片。無需註冊或API金鑰。
// 常見問題
問:什麼是圖片轉Base64編碼?
答:圖片轉Base64編碼是使用Base64編碼將二進位圖片資料轉換為文字字串的過程。對於直接在HTML、CSS、電子郵件或API中嵌入圖片而無需單獨檔案至關重要。
問:圖片轉Base64轉換有多安全?
答:100%安全的本地處理。所有圖片編碼都在您的瀏覽器中進行。零伺服器上傳。您的圖片永遠不會離開裝置。
問:支援哪些圖片格式?
答:支援所有常見網頁圖片格式:PNG、JPEG、GIF、WebP、SVG、BMP等。保持原始圖片品質和格式。
問:如何在HTML中使用Base64圖片?
答:使用資料URI格式:<img src="data:image/png;base64,YOUR_BASE64_STRING">。非常適合內嵌圖片、圖示或減少HTTP請求。
問:有檔案大小限制嗎?
答:沒有伺服器端限制。處理在您的瀏覽器本地進行。大檔案可能需要更長時間編碼但可以正常運作。
// 常見圖片格式與 MIME 類型
| 格式 | MIME 類型 |
|---|---|
| PNG | image/png |
| JPEG | image/jpeg |
| GIF | image/gif |
| WebP | image/webp |
| AVIF | image/avif |
| SVG | image/svg+xml |
// 程式碼中的 Data URI
HTML <img src="data:image/png;base64,iVBORw0KGgo..." alt="">
CSS background: url("data:image/svg+xml;base64,PHN2Zy...");
Linux base64 -w0 logo.png
macOS base64 -i logo.png
Python base64.b64encode(open('logo.png','rb').read()).decode()
Node.js fs.readFileSync('logo.png').toString('base64')
>> 更多問題
問:為什麼 Base64 圖片會大約增大 33%?
答:Base64 把 3 個位元組編碼為 4 個字元,體積增加約三分之一,gzip 只能部分抵銷。因此內嵌圖片只適合很小的檔案(幾 KB)。
問:Data URI 相較一般圖片檔有什麼缺點?
答:內嵌圖片無法單獨快取,會增大 HTML 或 CSS,並在每次載入該檔案時重複傳輸。較大的圖片請使用獨立檔案。
問:SVG 應該用 Base64 內嵌嗎?
答:通常不需要:SVG 本身是文字。經 URL 編碼的 data:image/svg+xml,… 往往比 Base64 更小且可讀。不過 Base64 在各處都能穩定運作。