Utilia

Konverter Gambar ke Base64

Konversi gambar ke Base64 atau data URI lengkap dengan kode CSS dan HTML siap pakai, atau dekode Base64 kembali ke gambar. Gratis, privat, tanpa unggah.

Gambar → Base64

Base64 → gambar

Cara mengonversi gambar ke Base64

  1. Di Gambar → Base64, letakkan gambar di area unggah atau klik area itu untuk memilih (PNG, JPEG, GIF, WebP, SVG, ICO, BMP, AVIF…).
  2. Pilih Keluaran: Data URI (data:image/png;base64,…), Hanya Base64, CSS background-image, atau Tag HTML yang juga memuat lebar dan tinggi gambar.
  3. Klik Salin, atau Unduh sebagai .txt untuk hasil yang panjang.

Baris di bawah area unggah menampilkan format sebenarnya (dibaca dari byte file, bukan dari namanya), dimensi, ukuran file, dan panjang data URI.

Cara mengonversi Base64 kembali ke gambar

  1. Di Base64 → gambar, tempel teks ke Teks Base64 atau data URI. Anda bisa menempelkan string Base64 saja, data URI lengkap, bahkan seluruh aturan CSS atau tag <img>: data URI-nya akan ditemukan di dalamnya. Pemisah baris dan spasi diabaikan, dan Base64 aman-URL (dengan - dan _) juga berfungsi.
  2. Klik Dekode gambar. Pratinjau, tipe, dimensi, dan ukuran akan muncul.
  3. Klik Unduh gambar untuk menyimpannya dengan ekstensi file yang benar.

Tipe diperiksa dengan “magic bytes”, tanda pengenal di awal setiap format gambar (misalnya 89 50 4E 47 untuk PNG atau FF D8 FF untuk JPEG). Jika data URI mengaku image/jpeg padahal berisi PNG, alat ini memberi tahu Anda dan memakai tipe yang sebenarnya. Apa pun yang bukan gambar yang dikenali ditolak, dan batasnya adalah 20 MB data gambar.

Cara kerja Base64

Base64 mengubah setiap 3 byte file menjadi 4 karakter yang dapat dicetak, diambil dari A–Z, a–z, 0–9, +, dan /, dengan = sebagai padding di akhir. Itu sebabnya teks hasil enkode sekitar 33% lebih besar daripada filenya: ikon 30 KB menjadi sekitar 40 KB teks. Data URI menambahkan header pendek, data:<tipe>;base64,, agar browser tahu cara membacanya.

Kapan gambar layak disisipkan sebagai data URI

Data URI berguna untuk:

  • ikon, logo, dan latar kecil di CSS, untuk menghemat satu permintaan;
  • email HTML dan dokumen HTML satu file yang harus berfungsi tanpa file eksternal;
  • API JSON dan file konfigurasi yang hanya bisa membawa teks.

Data URI kurang cocok untuk foto besar. Teksnya sepertiga lebih besar daripada filenya, tidak bisa di-cache terpisah dari halaman atau stylesheet yang memuatnya, dan menunda render. Di atas kira-kira 10 sampai 100 KB, file gambar biasa dengan caching yang baik biasanya lebih unggul, itulah sebabnya alat ini menampilkan pengingat untuk gambar di atas 100 KB.

Semuanya berjalan di browser Anda: gambar dan teks yang ditempel tidak pernah diunggah.

Pertanyaan yang sering diajukan

Apakah Base64 cara untuk mengompres atau melindungi gambar?

Bukan. Base64 membuat data sekitar 33% lebih besar dan siapa pun dapat mendekodenya. Ia hanya mengubah data biner menjadi teks yang dapat dikirim ke tempat yang tidak bisa menerima data biner.

Mengapa data URI saya tidak tampil?

Penyebab paling umum adalah tipe di header yang hilang atau salah, spasi atau tanda kutip yang ikut tertempel di tengah string, atau teks yang terpotong. Tempel ke Base64 → gambar: alat ini melaporkan karakter yang tidak valid dan memeriksa tipe sebenarnya.

Bisakah saya memakai SVG sebagai data URI?

Bisa. SVG dapat dienkode ke Base64 seperti gambar lain. Untuk SVG, data URI berenkode URL (data:image/svg+xml,%3Csvg…) sering kali lebih pendek; alat ini mendekode kedua bentuk.

Apakah berfungsi dengan gambar HEIC atau AVIF?

Enkode berfungsi dengan file gambar apa pun. Pratinjau hanya muncul jika browser Anda dapat menampilkan formatnya, tetapi teks Base64 dan unduhannya selalu benar.

Apakah ada batas ukuran?

Ada, 20 MB data gambar, untuk kedua arah. String yang lebih besar membuat browser lambat dan jarang merupakan ide yang baik di halaman web.