tigtools

Gambar ke Base64

Ubah file PNG, JPEG, WebP, GIF, SVG, atau ICO menjadi teks Base64 yang dapat disematkan di HTML, CSS, atau JSON, atau dekode Base64 kembali menjadi gambar. File tidak pernah meninggalkan browser Anda.

Berjalan di browser Anda Tanpa perlu mendaftar

Arah konversi

atau letakkan file di sini (maks. 10 MB). File tetap tersimpan di perangkat Anda.

Cara menggunakan

  1. Pilih Image → Base64 dan pilih file gambar, atau pilih Base64 → Image untuk melakukan sebaliknya.
  2. Pilih output yang diperlukan: data URL, Base64 biasa, tag img HTML, aturan background-image CSS, atau Markdown.
  3. Salin hasilnya, lalu tempelkan ke kode, templat email, atau JSON.
  4. Untuk mendekode, tempelkan data URL atau Base64 biasa. Gambar akan ditampilkan dalam pratinjau dan dapat diunduh.

Cara kerja

Base64 merepresentasikan data biner menggunakan 64 karakter yang dapat dicetak, sehingga gambar bisa ditulis langsung di dalam format teks. Data URL menambahkan jenis media di awal, misalnya data:image/png;base64, diikuti byte yang telah dienkode. Browser menerima data URL di mana pun URL gambar dapat digunakan: pada atribut src di tag img, url() dalam CSS, atau referensi gambar SVG.

Teks hasil encoding selalu sekitar sepertiga lebih besar daripada file aslinya (4 karakter untuk setiap 3 byte). Menyematkan ikon kecil dan gambar placeholder dapat menghemat satu permintaan jaringan, tetapi data yang disematkan tidak bisa di-cache secara terpisah dan akan diunduh lagi setiap kali halaman atau stylesheet yang memuatnya dibuka. Karena itu, cara ini jarang menguntungkan untuk data berukuran lebih dari beberapa kilobyte. Banyak klien email memblokir atau menghapus gambar data URL, jadi lakukan pengujian sebelum menggunakannya di buletin.

File dienkode byte demi byte: tidak ada kompresi ulang, dan metadata di dalam file (seperti EXIF) tetap dipertahankan. Saat mendekode, alat ini menerima data URL lengkap, Base64 biasa, Base64 yang aman untuk URL, serta teks yang disalin bersama pembungkus CSS url(…). Jenis gambar dideteksi dari byte hasil dekode, bukan berdasarkan labelnya.

Contoh

Ikon kecil di stylesheet

Ikon PNG berukuran 600 byte menjadi string Base64 sepanjang 800 karakter. Pilih output CSS untuk mendapatkan aturan background-image yang bisa ditempelkan ke dalam class tanpa perlu menghosting file terpisah.

Gambar dari respons API

API mengembalikan kolom JSON seperti "iVBORw0KGgoAAAANSUhEUg…". Tempelkan ke Base64 → Image untuk melihat gambarnya, memeriksa ukurannya, dan mengunduhnya sebagai PNG.

Logo SVG di HTML

Mengodekan SVG menghasilkan URL data:image/svg+xml;base64 yang berfungsi di tag img. Untuk SVG, markup SVG yang tidak dikompresi sering kali lebih pendek daripada Base64, jadi pertimbangkan untuk menyematkan SVG secara langsung.

Pertanyaan yang sering diajukan

Mengapa versi Base64 lebih besar daripada gambar saya?

Base64 menggunakan 4 karakter teks untuk menyimpan 3 byte, sehingga ukurannya bertambah sekitar 33%, ditambah sedikit ukuran untuk awalan data URL. Kompresi Gzip atau Brotli di server web mengurangi selisih ini, tetapi tidak menghilangkannya.

Apakah encoding mengubah atau mengompresi gambar?

Tidak. Byte file yang persis sama akan dienkode, termasuk metadata apa pun. Untuk memperpendek string, kompres atau ubah ukuran gambar terlebih dahulu.

Apa perbedaan data URL dan Base64 biasa?

Base64 biasa hanya berisi byte yang dienkode. Data URL menambahkan awalan seperti data:image/jpeg;base64, yang memberi tahu browser jenis filenya sehingga bisa langsung digunakan sebagai sumber gambar.

Apakah ada batas ukuran?

File hingga 10 MB dapat dienkode di sini. String yang sangat panjang dapat memperlambat kolom teks dan editor, dan data URL sebesar itu tidak praktis digunakan di situs web.

Privasi

Encoding dan decoding dilakukan di browser Anda. Gambar dan teks Base64 tidak diunggah, disimpan, atau disertakan dalam analitik.