AVIF 轉 Base64 工具

將 AVIF 圖片編碼為 Base64，保留 AV1 壓縮帶來的極小體積。結果可用於 HTML、CSS、Markdown 或 JSON，並可為舊瀏覽器準備備用圖片。

轉換為最大寬度

將圖片拖放到這裡、點選選擇，或從剪貼簿貼上 支援 PNG、JPEG、GIF、WebP、SVG、BMP、ICO、AVIF 等格式，全部在本地處理。

完全在瀏覽器中執行，不會上傳任何資料。

使用方法

AVIF（AV1 影像檔案格式）把用 AV1 影片編碼壓縮的影像存放在 HEIF 容器中。它由開放媒體聯盟（Alliance for Open Media）於 2019 年釋出，支援透明、動畫、10 位和 12 位色深、HDR 以及廣色域。MIME 型別為 image/avif。

在相同的視覺品質下，AVIF 檔案往往明顯小於 JPEG，通常也小於 WebP，低位元速率時尤其如此。Base64 對任何檔案都會增加三分之一，因此 AVIF 越小，Data URI 就越短。

Chrome 85、Firefox 93、Safari 16 和 Edge 121 及以上版本都能顯示 AVIF，更早的瀏覽器和大多數郵件客戶端則無法顯示。在網頁中，可以把 Data URI 放進帶備用圖片的 <picture> 元素：

<picture>
  <source type="image/avif" srcset="data:image/avif;base64,...">
  <img src="logo.png" alt="Logo" width="120" height="40">
</picture>

備用圖片應保留為單獨檔案。如果它也寫成 Data URI，每位訪問者都要隨 HTML 一起下載兩個版本。

本工具會原樣編碼你的 AVIF 檔案。轉換目標只有 PNG、JPEG 和 WebP，不包括 AVIF，所以要從其他格式生成 AVIF，請先使用 avifenc、Squoosh 或影像編輯軟體等專門的編碼器，再把結果拿到這裡編碼。

在能夠解碼 AVIF 的瀏覽器中，可以把 AVIF 轉換為 PNG、JPEG 或 WebP，方便提交給不接受 AVIF 的系統，但結果通常會更大。如果既要相容性好又要體積小，WebP 是最接近的替代方案。

可以在這裡把 PNG 或 JPEG 轉成 AVIF 嗎？

不可以。轉換目標只有 PNG、JPEG 和 WebP。請先用其他工具生成 AVIF 檔案，再拖到這裡進行編碼。

哪些瀏覽器能顯示 data:image/avif 圖片？

Chrome 85+、Firefox 93+、Safari 16+ 和 Edge 121+。對於更早的瀏覽器，請在 picture 元素中提供 PNG 或 JPEG 備用圖片。

為什麼我的 AVIF 圖片沒有預覽？

很可能是你的瀏覽器無法解碼 AVIF。Base64 輸出仍然根據檔案位元組生成，結果是正確的；換用新版瀏覽器開啟頁面即可看到預覽。

AVIF 的 Base64 比 WebP 的更短嗎？

在相近的視覺品質下通常如此。Base64 對兩種格式都會增加 33%，所以原始檔越小，字串就越短。