Görsel'den Base64 & Data URI
Çift yönlü. Çoklu dosya desteği. Yedi çıktı formatı (ham, data URI, CSS background, HTML img, Markdown, JSON, blurDataURL placeholder ile Next.js Image). Kodlamadan önce optimizasyon (resize / kalite / format). Çözümlemede otomatik MIME tespiti.
Görselleri sürükle bırak veya tıklayıp seç
PNG, JPEG, WebP, GIF, SVG, BMP, AVIF — birden çok dosya aynı anda.
İpucu: Ctrl+V (macOS'ta Cmd+V) ile görseli doğrudan yapıştırabilirsin.
Önce optimize et
Gömmeden önce canvas üzerinden yeniden boyutlandırıp tekrar kodla. Daha az bayt, daha küçük data URI demektir.
Çıktı formatı
Maks. genişlik: 1600px
Daha büyük görseller orantılı küçültülür.
Maks. yükseklik: 1600px
Oran korunur.
Kalite: 0.85
Kalite yalnızca JPEG ve WebP için geçerlidir.
Data URI ne zaman mantıklı — ne zaman değil
Uygun: küçük gömülü varlıklar
~2 KB altındaki ikonlar ve tek seferlik SVG glifleri ek HTTP isteği gerektirmeden CSS veya HTML içinde gönderilir.
Uygun değil: önbelleğe alınabilecek her şey
Barındırılan dosyalar bağımsız önbelleklenir, sayfalar arası tekrar kullanılır ve CDN sıkıştırmasından yararlanır. Data URI'lar bunu yapamaz.
CSP açıkça izin vermeli
İçerik güvenlik politikan, data URI'ların yüklenmesi için `img-src 'self' data:` (veya eşdeğer direktifi) içermelidir.
E-posta uyumluluğu değişken
Modern istemcilerin çoğu <img src="data:…"> kabul eder ama Outlook for Windows ve bazı webmail istemcileri bunları temizler. Göndermeden test et.
SEO etkisi
Arama motorları gömülü görselleri iyi indekslemez. Paylaşılabilir içerik için `alt` özelliği olan barındırılan URL kullan.
Base64 ~%33 daha büyük
Kodlama, ham baytı HTTP sıkıştırmasından önce yaklaşık üçte bir büyütür. Gzip bunun çoğunu geri kazanır ama tamamını değil.