Pengkode Base64 Gambar Konversi gambar menjadi URI data yang dikodekan Base64 untuk disematkan dalam HTML, CSS, dan kode.

🖼️

Gambar ke Base64

Konversi gambar menjadi URI data yang dikodekan Base64 untuk disematkan dalam HTML, CSS, dan kode.

Unggah Gambar Anda

Tarik dan lepas atau pilih berkas gambar untuk dikodekan sebagai Base64.

Salin Keluaran

Salin data URI, string Base64 mentah, atau tag img HTML lengkap.

Gunakan dalam Kode

Tempelkan data Base64 langsung ke kode HTML, CSS, atau JavaScript Anda.

Loading tool...

What Is Gambar ke Base64?

Pengkode image ke Base64 mengubah file gambar menjadi string teks yang dapat disematkan langsung di dalam kode HTML, CSS, atau JavaScript. Pengkodean Base64 merepresentasikan data gambar biner sebagai karakter ASCII, sehingga memungkinkan untuk menyertakan gambar secara inline tanpa permintaan file terpisah. Alat ini menghasilkan tiga output: URI data lengkap, string Base64 mentah untuk API, dan tag img HTML yang siap ditempel. Ini sangat berguna untuk ikon kecil, logo, dan elemen antarmuka pengguna di mana mengurangi permintaan HTTP meningkatkan kinerja.

Why Use Gambar ke Base64?

Tiga format keluaran: data URI, Base64 mentah, dan tag HTML
Menghilangkan permintaan HTTP untuk gambar kecil
Siap tempel untuk HTML, CSS, dan JavaScript
Menampilkan panjang Base64 untuk estimasi ukuran

Common Use Cases

Gambar Inline di HTML

Sematkan gambar kecil langsung ke dalam HTML untuk mengurangi permintaan HTTP.

Gambar Latar Belakang CSS

Gunakan data URI Base64 pada properti background-image CSS.

Templat Email

Sematkan gambar langsung ke dalam email HTML untuk menghindari tautan gambar yang rusak.

Muatan API

Masukkan data gambar ke dalam muatan JSON untuk API yang menerima gambar dengan kode Base64.

Technical Guide

Pengkodean Base64 mengubah data gambar biner menjadi string dari 64 karakter ASCII. Metode readAsDataURL API FileReader membaca file dan menghasilkan URI data. Pengkodean Base64 meningkatkan ukuran data sekitar 33% karena setiap 3 byte data biner menjadi 4 karakter Base64. Oleh karena itu, ini paling efisien untuk gambar kecil di bawah 10KB.

Tips & Best Practices

1
Paling baik untuk gambar kecil (ikon, logo) di bawah 10KB untuk menghindari pembengkakan kode
2
Base64 meningkatkan ukuran berkas sekitar 33% - jangan gunakan untuk gambar besar
3
Data URI di CSS tidak dapat di-cache terpisah seperti gambar eksternal
4
Gunakan keluaran tag img HTML untuk penempelan cepat ke halaman web

Related Tools

Konverter Format Gambar

Ubah gambar antara format JPG, PNG, dan WebP dengan kontrol kualitas.

🖼️ Image Tools

PNG ke SVG

Bungkus gambar raster dalam wadah SVG untuk alur kerja yang kompatibel dengan vektor.

🖼️ Image Tools

Base64 ke Gambar

Decodifikasi string atau data URI Base64 kembali menjadi gambar yang dapat dilihat dan diunduh.

🖼️ Image Tools

Pembuat Favicon

Buat favicon dalam berbagai ukuran (16x16, 32x32, 48x48 dan lain-lain) dari gambar apa pun.

🖼️ Image Tools

Frequently Asked Questions

Q Kapan saya harus menggunakan gambar Base64?

Untuk gambar kecil (ikon, logo di bawah 10KB) di mana mengurangi permintaan HTTP lebih penting daripada peningkatan ukuran sebesar 33%.

Q Mengapa Base64 lebih besar dari aslinya?

Pengkodean Base64 mengubah 3 byte menjadi 4 karakter, sehingga menghasilkan kenaikan ukuran sekitar 33%.

Q Dapatkah saya menggunakan Base64 di CSS?

Ya, gunakan data URI pada properti background-image: url(data:image/png;base64,...) atau properti gambar CSS lainnya.

Q Apakah itu bekerja dengan semua format gambar?

Ya, setiap format gambar yang didukung oleh browser Anda dapat dikodekan menjadi Base64.

Q Apakah ada batas ukuran?

Tidak ada batasan keras, tetapi penggunaan Base64 untuk gambar di atas 100KB membuat kode menjadi tidak rapi.

About This Tool

Gambar ke Base64 is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.