Görsel Base64 Kodlayıcı HTML, CSS ve kodlarda gömme amacıyla görselleri Base64-kodlu veri URI'lerine dönüştürün.
Görsel Base64'e Dönüştür
HTML, CSS ve kodlarda gömme amacıyla görselleri Base64-kodlu veri URI'lerine dönüştürün.
Görüntünüzü Yükle
Base64 olarak kodlamak için herhangi bir görüntü dosyasını bırakın veya seçin.
Çıktıyı Kopyala
Veri URI'sini, ham Base64 dizgisini veya tam HTML img etiketini kopyalayın.
Kodunuzda Kullanın
Base64 verilerini doğrudan HTML, CSS veya JavaScript kodunuza yapıştırın.
What Is Görsel Base64'e Dönüştür?
Bir görüntü Base64 kodlayıcısı, görüntüleri HTML, CSS veya JavaScript kodu içinde doğrudan gömülebilen metin dizilerine dönüştürür. Base64 kodlama, ikili görüntü verilerini ASCII karakterleri olarak temsil eder ve ayrı dosya isteklerine gerek kalmadan resimleri satır içi eklemeyi sağlar. Araç, üç çıktı üretir: tam bir veri URI'si, API'ler için ham Base64 dizesi ve doğrudan yapıştırılabilecek bir HTML img etiketi. Bu özellikle küçük simgeler, logolar ve UI öğeleri için yararlıdır; burada HTTP isteklerinin azaltılması performansı artırır.
Why Use Görsel Base64'e Dönüştür?
-
Üç çıktı formatı: veri URI'si, ham Base64 ve HTML etiketi
-
Küçük resimler için HTTP isteklerini ortadan kaldırır
-
HTML, CSS ve JavaScript için kopyala-yapıştır hazır
-
Base64 uzunluğunu boyut tahmini için gösterir
Common Use Cases
HTML'de İçli Görüntüler
Küçük resimleri doğrudan HTML'ye gömerek HTTP isteklerini azaltın.
CSS Arka Plan Resimleri
CSS arka plan-görüntü özelliklerinde Base64 veri URI'lerini kullanın.
E-posta Şablonları
Görüntüleri doğrudan HTML e-postalarına gömerek kırık görüntü bağlantılarını önleyin.
API Yükleri
Base64 kodlu resimleri kabul eden API'ler için JSON yüklerine görüntü verilerini dahil edin.
Technical Guide
Base64 kodlama, ikili görüntü verilerini 64 ASCII karakterinden oluşan bir dizeye dönüştürür. FileReader API'nin readAsDataURL yöntemi dosyasını okur ve bir veri URI'si üretir. Base64 kodlaması, veri boyutunu yaklaşık %33 oranında artırır; çünkü her 3 bayt ikili verinin 4 Base64 karakterine dönüşmesi nedeniyle en verimli küçük resimler için kullanılır, özellikle 10KB'ın altındaki resimler.
Tips & Best Practices
-
1En iyi küçük resimler (ikonlar, logolar) için uygundur (10KB altı), kod şişkinliğini önlemek için
-
2Base64, dosya boyutunu yaklaşık %33 oranında artırır - büyük resimler için kullanmayın
-
3CSS'deki veri URI'leri, dış görüntü dosyaları gibi ayrı olarak önbelleğe alınamaz
-
4Web sayfalarına hızlı bir şekilde kopyala-yapıştırmak için HTML img etiketi çıktısını kullanın
Related Tools
Resim Biçim Dönüştürücü
JPG, PNG ve WebP biçimleri arasında resim dönüştürme işlemi kaliteli kontrol ile yapılır.
🖼️ Image Tools
PNG'den SVG'ye
Vektör uyumlu iş akışları için raster görüntüleri bir SVG kabına sarın.
🖼️ Image Tools
Base64'den Resim
Base64 dizilerini veya veri URI'lerini tekrar görüntülenebilir, indirilebilir resimlere dönüştürün.
🖼️ Image Tools
Favicon Oluşturucu
Herhangi bir görüntüden çoklu boyutlarda (16x16, 32x32, 48x48 ve daha fazlası) favicon oluşturun.
🖼️ Image ToolsFrequently Asked Questions
Q Base64 resimlerini ne zaman kullanmalıyım?
Q Neden Base64 orijinalinden daha büyük?
Q CSS'de Base64 kullanabilir miyim?
Q Tüm resim formatlarını destekler mi?
Q Boyut sınırı var mı?
About This Tool
Görsel Base64'e Dönüştür 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.