Base64
Image Data URL
⚠️ Large image may freez the browser
產生 CSS 背景 Base64
將圖像轉換為Base64或DataURL格式，用於作為CSS背景或其他網頁應用程式。 上傳您的圖像，選擇所需的標籤，並複製生成的代碼。 適合將圖像直接嵌入您網站的代碼中，但大型圖像可能會影響效能。
Image → Base64 / Data URL
Click or Drag & Drop an Image
將圖像轉換為 Base64 編碼
1
上傳你的圖片
點擊或拖曳圖片到上傳區域即可。
2
選擇 Base64 或 DataURL
選擇「Base64」或「DataURL」選項以選擇所需的格式。
3
查看Base64碼
Base64或DataURL碼將出現在下方標籤區的文本區域中
4
複製生成代碼
點擊「複製」按鈕將生成的代碼複製到您的剪貼板上。
直接在CSS中嵌入圖片
使用Base64或DataURL編碼直接嵌入CSS中的圖像，以減少HTTP請求並優化網站效能。這種方法通過消除單獨的圖像文件來改善載入時間，同時保持視覺元素，例如小圖標或裝飾性圖形。它支援高效整合輕量級資產，而不影響網站速度。
快速CSS背景並使用編碼圖像
將圖像編碼為 Base64 或 DataURL 格式以設定 CSS 背景。 這種方法簡化工作流程，將視覺效果直接整合到程式碼中。 減少對外部圖像檔案的需求可以降低 HTTP 請求並改善網站效能。 適用於整合小型視覺效果，同時提升效能。
常見問題
Base64又是DataURL是什麼？
Base64和DataURLs是將圖像表示為文字字串的方式。這允許您直接將圖像嵌入到網站程式碼中，避免需要使用個別的圖像檔案。
我該如何使用產生的Base64或DataURL？
生成的代碼可用於 CSS 背景圖片、HTML 屬性或任何接受資料 URI 的情境。例如，你可以像這樣在 CSS 中使用它：background-image: url('data:image/png;base64,...');
我為什麼應該用這個工具，而不是其他方法？
這個工具提供簡單方便的方式，只需單擊和複製按鈕即可將圖像轉換為Base64或DataURL。它快速且易於使用。
使用這個工具有什麼限制嗎？
大型圖片不建議使用，因為它們會降低您的電腦在轉換過程中效能。
支援哪些圖像格式？
這款工具支援常見的圖像格式，例如PNG、JPG和GIF。