Gambar ke Base64
Konversi gambar PNG, JPG, WebP, atau GIF menjadi data URI Base64, string Base64 biasa, tag img HTML, atau background CSS. Ideal untuk menyematkan ikon kecil
Letakkan file gambar Anda di sini
atau klik untuk memilih file
Ubah PNG, JPG, WebP, GIF, atau SVG menjadi Base64 dan dapatkan dalam bentuk yang benar-benar Anda butuhkan: data URI lengkap, string Base64 murni, tag <img> HTML, atau deklarasi background CSS, semuanya siap tempel.
Menyematkan grafik kecil langsung di dalam kode menghilangkan satu permintaan jaringan dan memastikan ikonnya tetap muncul bahkan sebelum stylesheet dimuat - itulah sebabnya data URI populer untuk ikon, spinner, dan tanda tangan email. Konsekuensinya adalah ukuran: Base64 sekitar sepertiga lebih besar daripada file binernya dan tidak bisa di-cache terpisah, jadi batasi pemakaiannya untuk aset kecil dan tautkan gambar yang lebih besar seperti biasa.
Cara mengonversi gambar ke Base64
Pilih sebuah gambar
Pilih format output yang Anda butuhkan
Salin data URI, tag, atau CSS-nya
FAQ
Kapan sebaiknya saya menyematkan gambar alih-alih menautkannya?
Untuk grafik kecil yang sering dipakai di bawah sekitar 10 KB - ikon, logo, spinner - ketika menghemat satu permintaan lebih penting daripada kenaikan ukurannya. Foto besar sebaiknya tetap berupa file agar browser bisa menyimpannya di cache.
Mengapa string Base64 lebih besar daripada file saya?
Base64 mengodekan setiap tiga byte menjadi empat karakter, yang menambah sekitar 33%. Overhead itu tidak terhindarkan dalam pengodean itu sendiri.
Format apa saja yang bisa saya pakai?
PNG, JPG, WebP, GIF, dan SVG. SVG vektor yang disematkan sebagai data URI tetap dapat diskalakan, jadi sering kali itu pilihan terbaik untuk ikon.
Apakah berfungsi di CSS maupun di HTML?
Ya, salin bentuk CSS-nya untuk dipakai pada deklarasi background-image, atau bentuk HTML-nya untuk atribut img src.
Apakah klien email akan menampilkannya?
Sebagian besar klien modern menampilkannya, tetapi sebagian membuang data URI demi keamanan. Untuk templat email, host gambarnya dan tautkan jika tata letaknya penting.
Apakah gambar saya diunggah?
Tidak, pengodeannya terjadi di browser Anda.
Sekilas
| Masukan | gambar |
|---|---|
| Beberapa file | Ya |
| Dijalankan di | Di browser Anda - file tidak pernah diunggah |
| Bekerja offline | Ya — setelah halaman dimuat |
| Harga | Gratis, tanpa pendaftaran, tanpa tanda air |
Di mana konversi diam-diam rusak
Sebagian besar bug konversi bukan soal sintaksis, melainkan soal makna. Kolom kode pos pada CSV kehilangan angka nol di depannya begitu spreadsheet menduga kolom itu berisi angka; ID yang panjang melampaui presisi floating-point; tanggal berubah makna tergantung apakah formatnya tanggal-dulu atau bulan-dulu. Kunci JSON tidak berurutan, sedangkan array berurutan, dan alat yang mengurutkan kunci tidak mengubah apa pun sementara alat yang mengurutkan array mengubah datanya. Unicode adalah jebakan lain: teks bisa datang sebagai UTF-8, UTF-16, atau dengan BOM, dan dekoder yang salah menebak mengubah karakter beraksen menjadi mojibake. Sebelum memercayai konversi apa pun, periksa sekilas baris pertama dan terakhir, setiap bidang yang memiliki angka nol di depan, dan setiap bidang yang memuat tanda kutip, koma, atau baris baru.
Memilih format data
JSON adalah pilihan default untuk apa pun yang dikembalikan sebuah API atau dibaca sebuah program: format ini secara alami menangani struktur bersarang, angka, boolean, dan null, dan setiap bahasa bisa mengurainya. CSV lebih kecil dan langsung terbuka di spreadsheet, tetapi tidak punya cara untuk menyatakan penyarangan dan tidak punya standar bersama untuk pemisah, tanda kutip, atau set karakternya - dan di situlah konversi biasanya salah. XML lebih bertele-tele, tetapi membawa atribut, konten campuran, dan skema, sehingga masih mendominasi format dokumen dan integrasi warisan. YAML paling mudah dibaca untuk konfigurasi, tetapi peka terhadap spasi dan punya pemaksaan tipe yang mengejutkan ("no" menjadi false, versi seperti 1.10 menjadi 1.1). Pilih format yang disukai alat yang akan memakainya, bukan format yang terlihat paling bagus.