Konverter Gambar ke BASE64

Memulihkan berkas yang dipilih...

URL data Base64 menggabungkan jenis media dan byte gambar yang telah dienkode dalam satu nilai teks, misalnya data:image/png;base64,.... Pilih gambar hingga 20 MiB dan konverter akan membuat nilai tersebut secara lokal di peramban. Sebelum menyalinnya, Anda dapat memeriksa rincian berkas asli dan perkiraan panjang URL data yang dihasilkan.

Cara mengodekan gambar dengan format Base64

  1. 1

    Pilih gambar

    Pilih satu berkas gambar dengan ukuran maksimal 20 MiB.

  2. 2

    Enkode secara lokal

    Peramban membaca berkas dan membuat URL data Base64 lengkap tanpa mengunggahnya.

  3. 3

    Periksa hasil

    Periksa jenis media, rincian berkas, dan perkiraan panjang URL data yang dihasilkan.

  4. 4

    Salin URL data

    Salin nilai lengkap `data:image/...;base64,...` ke papan klip.

Kapan harus ditampilkan secara inline, dan kapan harus dihubungkan

Penyisipan Base64 dapat menyimpan permintaan HTTP meskipun mengakibatkan peningkatan ukuran sebesar 33%, hal ini layak dilakukan untuk beberapa jenis aset, namun tidak efisien bagi yang lain.

Perhitungan ukuran

Ukuran asli Ukuran Base64 Byte tambahan
1 KB 1.36 KB 360 B
10 KB 13.6 KB 3.6 KB
100 KB 136 KB 36 KB
1 MB 1.36 MB 360 KB

Panduan keputusan

Kasus penggunaan Inline atau eksternal
Ikon berukuran kurang dari 2 KB (logo SVG, sprite) Inline
Gambar kursor dalam CSS (cursor: url()) Inline
Demo HTML atau CSS kecil yang mandiri Inline
Ikon yang disematkan dalam payload JavaScript Inline
Gambar hero, lebih dari 50 KB Eksternal
Apa pun yang dapat disimpan terpisah dalam cache Eksternal

Format URI data

data:[<mediatype>][;base64],<data>

Contoh:

  • data:image/png;base64,iVBORw0KGgo..., PNG
  • data:image/svg+xml;utf8,<svg>...</svg>, format SVG; umumnya lebih cocok digunakan secara inline tanpa encoding Base64
  • data:image/jpeg;base64,/9j/4AAQS..., JPG

Tips

  • SVG umumnya lebih baik digunakan sebagai url() dengan pengkodean utf8 daripada base64; formatnya lebih singkat dan lebih mudah dibaca.
  • Enkoding tidak memeriksa atau membersihkan isi gambar. Sematkan hanya berkas tepercaya, terutama SVG yang dapat memuat konten aktif atau eksternal.
  • Gambar berukuran besar dalam payload JSON dapat menghambat proses parsing jika sangat besar; pertimbangkan penggunaan format multipart atau referensi eksternal.
  • CSS background-image dengan format base64 dapat ditampilkan secara rapi, namun menghambat penggunaan caching di berbagai halaman.

Pertanyaan yang Sering Diajukan

Base64 mengkodekan 3 byte data masukan menjadi 4 karakter, sehingga hasil keluaran selalu sekitar 33% lebih panjang daripada data masukan. Sebuah gambar berukuran 10 KB akan menghasilkan deretan karakter sekitar 13.600 karakter; panjang seperti ini merupakan hal yang umum terjadi.

Konverter menerima satu gambar hingga 20 MiB. Ini batas pemrosesan, bukan anjuran untuk menyematkan berkas sebesar itu. URL data sebaiknya tetap kecil karena Base64 menambah ukuran sekitar sepertiga dan mencegah penyimpanan cache terpisah.

Tidak. Enkoding Base64 dijalankan langsung di peramban Anda; gambar tidak pernah keluar dari perangkat Anda.

Tidak di enkoder ini. Gunakan alat Base64 ke Gambar yang terpisah untuk mengubah URL data atau string Base64 mentah menjadi berkas gambar yang dapat diunduh.

Alat Terkait