Base64 轉 WebP
從 Base64 還原 WebP，預覽並下載原始圖片。
0 字元
01
不重新壓縮
保留原始畫質、透明度與動畫影格。
02
Data URI 或 Base64
可複製含 image/webp 前綴的 URI，或僅取出 Base64。
03
瀏覽器內處理
圖片資料不會傳送到伺服器。
技術說明
Base64 字串
- >data:image/webp;base64,…
- >Base64 / Base64URL
適用情境
- >HTML / CSS
- >JSON / API
運作方式
工具會移除 Data URI 前綴、解碼 Base64，再檢查 WebP 檔案特徵。不會將其他圖片格式轉成 WebP。
範例:
data:image/webp;base64,UklGRiIAAABXRUJQVlA4IBYAAAAwAQCdASoBAAEADsD+JaQAA3AAAAAA
在瀏覽器中處理，不必上傳資料。
- >保留原始畫質、透明度與動畫影格。
- >圖片資料不會傳送到伺服器。
運作方式
01
解碼
貼上 WebP 圖片的 Base64 字串或完整 Data URI。
02
下載
從 Base64 還原 WebP，預覽並下載原始圖片。
範例
JavaScript
const base64 = 'UklGRiIAAABXRUJQVlA4IBYAAAAwAQCdASoBAAEADsD+JaQAA3AAAAAA';
const bytes = Uint8Array.from(atob(base64), c => c.charCodeAt(0));
const file = new Blob([bytes], { type: 'image/webp' });工具會移除 Data URI 前綴、解碼 Base64，再檢查 WebP 檔案特徵。不會將其他圖片格式轉成 WebP。
常見問題
可以貼上完整 Data URI 嗎？
可以。支援 data:image/webp;base64,…、無前綴 Base64、空白、換行及 Base64URL。
可以將 PNG 或 JPG 轉成 WebP 嗎？
不行。此工具只還原原始 WebP。若不確定格式，請用 Base64 圖片解碼器。
為什麼無法預覽？
請確認字串完整且內容為有效 WebP。動畫播放也需要瀏覽器支援。
資料會上傳到伺服器嗎？
不會，處理過程都在瀏覽器中完成。
其他語言
參考資料
我們如何確保結果正確
我們使用以下自動化測試驗證此工具。下方保留測試案例的原始名稱，方便查看實際斷言及重現。
- 驗證方法
- 比較標準、URL-safe、無填充和 Data URI 解碼後的字節，並檢查真實文件簽名優先於錯誤 MIME 標籤。
- 對比依據
- 明確二進制樣本、文件簽名與字節斷言。
- 驗證範圍
- 驗證字節與格式判斷；不等於所有圖片都可以被瀏覽器完整解碼。
測試原始碼與案例（點選檔名檢視）
-
base64-image.test.js
- image decoding preserves bytes for raw, wrapped, URL-safe and unpadded Base64
- file signatures determine the actual format even when the data URI lies
這些測試涵蓋列出的樣本和邊界，不代表所有輸入都已證明正確。往返測試和使用同一依賴套件的檢查，不屬於獨立交叉驗證。