Bu uygulamalı örneği takip edin, ardından aynı kontrolleri kendi görselinize uyarlayın. Görselden Base64 Dönüştürücü aç.
Bir görsel seçin ve kimliğini önizleyin
Görselden Base64 Dönüştürücüyü açın. Bir görsel seçin veya bir örnek deneyin. Örnek, 202,491 bayt içeren 512 × 512 piksellik favicon-orbit.png dosyasını kullanır. Düzenleyici, görseli kodunun üzerinde gösterir, böylece seçtiğiniz varlığın doğru olduğunu onaylayabilirsiniz.
Tarayıcınız önizleme için kodlarını çözebildiğinde PNG, JPG, WebP, GIF, BMP ve AVIF desteklenir. Maksimum dosya boyutu 25 MB olup, 60 megapiksel ve kenar başına 16,000 piksel sınırı vardır. SVG biçimlendirmesi bu raster dönüştürücü tarafından kabul edilmez.
Araç, orijinal dosya baytlarını okur. Görseli yeniden oluşturmak, yeniden boyutlandırmak veya yeniden sıkıştırmak için önizlemeyi kullanmaz. Bu nedenle, mevcut meta veriler ve GIF animasyonu kodlanmış verilerde korunur.
Kodlamadan önce, daha küçük bir varlığa ihtiyacınız varsa Görseli Yeniden Boyutlandır veya Görsel Sıkıştırıcı'yı kullanın. Base64 tek başına görsel boyutunu küçültmez.
Projenizin beklediği gösterimi seçin
Ayarlar'ı açın ve bu örnek için Kod formatı altında HTML görselini seçin. Sonuç, bir Base64 veri URL'si içeren bir img etiketidir. Alt özniteliği başlangıçta boştur; görsel bilgi aktardığında yararlı bir alternatif metin yazın.
Veri URL'si, data:image/png;base64 gibi bir önekle başlar ve ardından kodlanmış veriler gelir. Düz Base64 yalnızca verileri içerir. CSS arka planı, veri URL'sini bir background-image bildirimine sarar. Bu gösterimler farklı hedeflere hizmet eder, bu nedenle yalnızca dosya adını değiştirmek yerine uygulamanızın talep ettiği formu kopyalayın.
Kod paneli, Kod formatını değiştirdikten hemen sonra güncellenir. Kopyala simgesi mevcut gösterimi kopyalar ve paylaşılan kopyalama onayını verir. Pano erişimi engellendiğinde, kod manuel kopyalama için seçilir.
Eksiksiz bir HTML img etiketi, bir veri URL'si ile aynı şey değildir. Bir alan URL istediğinde yalnızca src değerini kullanın.
Bu kılavuzdaki örnek
Bir örnek deneyin: favicon-orbit.png, 512 × 512 piksel, 202,491 bayt. Kod formatı altında HTML görselini seçin. Başlat'ı seçin ve favicon-orbit-base64.txt dosyasını indirin.
- Orijinal PNG
- 512 × 512 piksel · 202,491 bayt
- HTML metin çıktısı
- 270,029 bayt
- Kodlama
- Orijinal baytlar; yeniden sıkıştırma yok
Kodu indirin ve boyutunu anlayın
Başlat'ı, ardından İndir'i seçin. Örnek, HTML görüntü kodu içeren favicon-orbit-base64.txt dosyasını kaydeder. 270,029 baytlık boyutu, 202,491 baytlık kaynaktan daha büyüktür. Makaledeki karşılaştırma, indirilen metnin yalnızca okunabilirlik için kısaltılmış gerçek başlangıcını göstermektedir.
Base64 genellikle üç kaynak baytını dört metin karakterine dönüştürerek küçük sarmalayıcıdan önce yaklaşık üçte bir oranında ekleme yapar. Küçük bir simgeyi gömmek bir belgeyi kendi kendine yeterli hale getirebilir, ancak büyük görüntü dizelerini HTML veya CSS içine yerleştirmek de belgeyi büyütür ve görüntünün ayrı bir dosya olarak önbelleğe alınmasını engeller.
Kodlama, şifreleme değildir. Eksiksiz Base64 dizesine sahip herkes temel görüntüyü kurtarabilir. Özel bilgiler içeriyorsa koda kaynakla aynı özeni gösterin.
Bu makaledeki kısaltılmış alıntı açıklayıcıdır. İndirilen tam TXT dosyasını kullanın veya kodun tamamını araçtan kopyalayın.
Sıkça sorulan sorular
Kodlama görsel kalitesini düşürür mü?
Hayır. Kodlama orijinal baytları korur. Görseli yeniden boyutlandırmaz, sıkıştırmaz veya yeniden çizmez.
Base64 dizgisi neden görselden daha büyük?
Base64, üç giriş baytını dört metin karakteri kullanarak temsil eder, bu nedenle genellikle bir sarmalayıcı veya önekten önce yaklaşık üçte bir oranında ekleme yapar.
GIF animasyonları korunur mu?
Kodlama, animasyon dahil olmak üzere orijinal GIF baytlarını korur. Önizleme sabit bir kareyi gösterebilir ancak kodlanmış veri tüm kareleri tutar.
Base64 gizli görseller için güvenli mi?
Base64 bir şifreleme değildir. Eğer temel görsel gizliyse dizgiyi gizli tutun. Dönüştürücünün kendisi işlemi tarayıcınızda yerel olarak gerçekleştirir.
Doğru görüntüyü doğru koda dönüştürün.
Bir örnek deneyin veya kendi dosyanızı kullanın ve paylaşmadan önce sonucu inceleyin.
