Dört Kullanışlı Çıktı
Ham Base64, eksiksiz veri URI’si, HTML görüntü öğesi veya kullanıma hazır CSS arka plan bildirimi kopyalayın.
Görsel Araçları
•
Ücretsiz online araç
Görüntüyü Base64’e Dönüştür
PNG, JPG, WebP, GIF ve SVG görüntülerini doğrudan tarayıcınızda Base64 olarak kodlayın.
Ücretsiz
Kayıt gerekmez
Tarayıcı tabanlı
Online araç
Görüntüyü Base64’e Dönüştür
Hazır
Özel Tarayıcı Görüntü Kodlayıcısı
Görüntüleri Yüklemeden Base64’e Dönüştürün
Bir görüntüyü ham Base64 dizesi, eksiksiz veri URI’si, HTML görüntü etiketi veya CSS arka plan değeri olarak kodlayın. İşlem tarayıcınızda yerel olarak gerçekleştirilir.
Doğru Boyut Analizi
Kaynak dosyayı kodlanmış sonuçla karşılaştırın ve satır içinde kullanmadan önce tam boyut artışını görün.
Yerel ve Özel
Kaynak görüntünüz ve oluşturulan Base64 verileri tarayıcı belleğinde kalır ve dönüştürme için yüklenmez.
Kodlanacak Görüntüyü Yükleyin
Sürükleyip bırakın, panodan yapıştırın veya cihazınızdan bir görüntü seçin
Bir görüntüyü kopyalayın ve Ctrl+V veya Command+V tuşlarına basın Tarayıcınızda yerel olarak işlenir
Seçilen Görüntü
- Dosya adı
- Dosya türü
- Boyutlar
- Orijinal boyut
- Tahmini Base64 boyutu
Büyük dosya algılandı
Base64 çıktısı orijinal dosyadan yaklaşık %33 daha büyüktür ve önemli miktarda tarayıcı belleği gerektirebilir.
Animasyonlu GIF verileri Base64 kodlaması sırasında korunur.
SVG zaten metin tabanlıdır. HTML kullanımı için satır içi SVG işaretlemesi Base64’ten daha küçük ve esnek olabilir.
Görüntüyü kodlamadan önce lütfen doğrulamayı tamamlayın.
Görüntü Kodlanıyor
Görüntü tarayıcınızda yerel olarak okunuyor ve kodlanıyor…
Oluşturulan Base64 Çıktıları
Görüntü başarıyla kodlandı.
Oluşturulan Base64 Çıktıları
Projeniz için gereken biçimi seçin ve oluşturulan metni kopyalayın veya indirin.
Görüntü Kodlanıyor
Görüntü tarayıcınızda yerel olarak okunuyor ve kodlanıyor…
Kodlama Boyutu Özeti
- Kaynak dosya
- Base64 dizesi
- Eksiksiz veri URI’si
- Boyut artışı
- Orijinal boyutun :percent% kadarı
Base64, her üç kaynak baytı dört metin karakteriyle temsil ettiği için boyutu normalde yaklaşık %33 artırır.
Harici görüntü kullanmayı değerlendirin
Büyük Base64 görüntüleri HTML veya CSS boyutunu artırır, bağımsız olarak önbelleğe alınamaz ve sayfanın oluşturulmasını geciktirebilir.
Görüntünüz Bu Cihazdan Ayrılmaz
Kodlama, tarayıcı belleğinde JavaScript tarafından gerçekleştirilir. Görüntü ve oluşturulan çıktı bir CyberTools dönüştürme uç noktasına gönderilmez.
Görüntü Kalitesinde Kayıp Yok
Base64 geri döndürülebilir bir metin kodlamasıdır. Orijinal dosya baytlarını yeniden boyutlandırmadan, yeniden sıkıştırmadan veya kaliteyi değiştirmeden korur.
Base64’ü Seçici Kullanın
Satır içi Base64 çok küçük varlıklar için en kullanışlıdır. Önbelleğe alma ve geç yükleme avantajlarından yararlanan büyük görüntüler için harici dosyalar genellikle daha iyidir.
Özel Çevrimiçi Görüntü Kodlayıcısı
Görüntüyü Base64’e Dönüştür: Web’de Satır İçi Kullanım İçin Kodlama
PNG, JPG, JPEG, WebP, GIF veya SVG görüntülerini doğrudan tarayıcınızda Base64 metnine dönüştürün. Araç ham Base64 dizesi, eksiksiz veri URI’si, HTML görüntü örneği ve CSS arka plan örneği oluşturur.
Görüntü yerel olarak işlenir ve bir dönüştürme sunucusuna yüklenmez. Kodlanan tam boyutu inceleyebilir, kaynak dosyayla karşılaştırabilir ve yalnızca projenizin gerektirdiği çıktı biçimini kopyalayabilirsiniz.
Kullanıma Hazır Kod
Önekleri, MIME türlerini veya işaretlemeyi elle oluşturmadan ham Base64, veri URI’si, HTML ve CSS çıktısı üretin.
Boyut Maliyetini Anlayın
Sonucu bir web sayfasına eklemeden önce Base64 kodlamasının oluşturduğu tam karakter sayısını ve yüzde artışını görün.
Yalnızca Tarayıcıda İşleme
Özel tasarımları, şirket içi ekran görüntülerini ve müşteri varlıklarını dönüştürme boyunca kendi cihazınızda tutun.
Görüntüden Base64’e aracı ne yapar?
Kodlayıcı bir görüntünün ikili baytlarını okur ve bunları Base64 alfabıyla temsil eder. Orijinal ikili verileri bozmadan HTML, CSS, JSON, XML, e-posta ve diğer metin odaklı biçimlerde kullanılabilecek bir metin değeri üretir.
Dört çıktı sunulur: ham Base64 karakterleri, MIME türünü içeren eksiksiz veri URI’si, HTML img öğesi ve CSS background-image örneği. Kodu elle birleştirmeden uygulamanızın ihtiyaç duyduğu sürümü kopyalayabilirsiniz.
Bir görüntü Base64 olarak nasıl kodlanır?
PNG, JPG, JPEG, WebP, GIF veya SVG dosyası seçin, yükleme alanına sürükleyin ya da panodan bir görüntü yapıştırın. Dosya bilgilerini ve önizlemeyi inceleyin, gerektiğinde doğrulamayı tamamlayın ve kodlamayı başlatın.
Dönüştürmeden sonra orijinal ve kodlanmış boyutları karşılaştırın. Ham Base64, Veri URI’si, HTML veya CSS seçin, ardından çıktıyı kopyalayın ya da metin dosyası olarak indirin. Başka bir görüntüyü işlemeden önce aracı sıfırlayın.
Base64 kodlaması nasıl çalışır?
İkili dosyalar, görünür metin olarak güvenle temsil edilemeyen değerler de dahil olmak üzere 0 ile 255 arasında bayt değerleri içerir. Base64 girdiyi üç baytlık bloklara ayırır ve her bloğu 64 karakterlik bir alfabeden seçilen yazdırılabilir dört ASCII karakterine eşler.
İşlem belirleyicidir ve kayıpsızdır. Base64 dizesi çözüldüğünde aynı kaynak baytlar yeniden oluşturulur. Girdi uzunluğu üçe tam bölünmüyorsa son bloğa dolgu karakterleri eklenebilir.
Base64 çıktısı neden yaklaşık %33 daha büyüktür?
Her üç kaynak veri baytı dört Base64 karakterine dönüşür. Bu dörde üç oranı kodlanmış metnin normalde orijinal dosyadan yaklaşık üçte bir daha büyük olmasına yol açar; dolgu ve veri URI’si öneki de küçük bir ek fark oluşturur.
30 KB boyutundaki bir görüntü yaklaşık 40 KB Base64 karakteri üretir. Bu artış kodlama yönteminin bir parçasıdır ve farklı bir gösterim seçmeden veya kaynak dosyayı önce küçültmeden kaldırılamaz.
Base64 veri URI’lerini anlamak
Ham Base64 dizesi dosya türünü belirtmez. Veri URI’si kodlanmış karakterlerin önüne data: önekini, görüntünün MIME türünü ve ;base64 işaretini ekler. Tarayıcı böylece tüm değeri satır içi görüntü URL’si olarak işleyebilir.
Veri URI’leri HTML img src özniteliğinde, CSS background-image değerinde veya URL kabul eden başka bir bağlamda kullanılabilir. Oluşturulan örnekler seçilen dosyadan alınan doğru MIME türünü içerir.
Satır içi Base64 görüntüleri ne zaman kullanışlıdır?
Base64 küçük arayüz simgeleri, yükleme göstergeleri, e-posta varlıkları, taşınabilir raporlar, test verileri ve bağımsız HTML dosyaları için kullanışlı olabilir. Bu durumlarda ayrı bir görüntü isteğini kaldırmak veya her şeyi tek belgede tutmak değerli olabilir.
Bir varlığın JSON veya başka bir yalnızca metin yükü içinde taşınması gerektiğinde de yararlıdır. Vite ve webpack gibi derleme araçları, yapılandırılan boyut sınırının altındaki küçük varlıkları sıklıkla otomatik olarak satır içine alır.
Harici görüntü ne zaman daha iyi bir seçimdir?
Büyük fotoğraflar, kahraman görüntüleri, tekrarlanan simgeler ve sayfanın aşağısındaki medya genellikle harici dosya olarak daha iyi çalışır. Harici görüntüler bağımsız olarak önbelleğe alınabilir, paralel getirilebilir, teslim altyapısı tarafından sıkıştırılabilir ve yalnızca gerektiğinde geç yüklenebilir.
Satır içi Base64 görüntüsü HTML veya CSS dosyasının parçası olur. Ayrıştırma işini artırır, ayrı olarak önbelleğe alınamaz ve onu içeren belge her değiştiğinde yeniden indirilmesi gerekir.
Gizlilik ve hassas görüntüler
Base64 kodlamadır, şifreleme değildir. Çıktıyı alan herkes çözerek orijinal görüntüyü yeniden oluşturabilir. Base64 dizesini gizli görsel bilgileri saklama yöntemi olarak görmeyin.
Bu araç kodlamayı tarayıcı belleğinde yerel olarak gerçekleştirir ve görüntüyü bir CyberTools dönüştürme uç noktasına göndermez. Yerel işleme; şirket içi diyagramlar, müşteri varlıkları, özel ekran görüntüleri ve gizlilik gerektiren dosyalar için önemlidir.
SVG ve animasyonlu GIF ile ilgili noktalar
Base64, tüm animasyon kareleri dahil her baytı koruduğu için animasyonlu GIF hareketini sürdürür. Uyumlu bir HTML görüntü öğesinde kullanıldığında ortaya çıkan veri URI’si orijinal GIF gibi davranır.
SVG zaten metin tabanlı bir XML biçimidir. Doğrudan satır içi SVG işaretlemesi çoğu zaman daha küçüktür ve tek tek öğelerin biçimlendirilmesine veya betiklerle yönetilmesine olanak tanır. Base64 kodlu SVG, CSS arka planı gibi URL değeri gereken yerlerde kullanışlıdır.
Modern web projelerinde Base64 kullanmak
React, Vue ve diğer çerçeveler görüntü özniteliklerinde veya stil bağlamalarında veri URI’lerini kullanabilir. Küçük ve tek seferlik varlıklar için kullanışlıdır; ancak büyük görüntüler genellikle dosya olarak içe aktarılmalıdır, böylece derleme sistemi adları, önbelleği ve teslimatı optimize edebilir.
Birçok paketleyici yapılandırılabilir satır içi sınırlar sunar. Sınırın altındaki varlıklar veri URI’si olurken daha büyük dosyalar ayrı üretilir. Bu, istek ek yükünü Base64 boyut artışı ve önbellek davranışıyla dengeler.
Kodlayıcının Oluşturduğu Çıktılar
| Çıktı | İçeriği |
|---|---|
| Ham Base64 dizesi | MIME türü veya veri URI’si öneki olmadan yalnızca kodlanmış karakterler. |
| Base64 veri URI’si | Satır içi URL olarak kullanılabilen eksiksiz data:[mime-type];base64,[content] değeri. |
| HTML kullanım örneği | Oluşturulan veri URI’sini src özniteliğinde içeren img öğesi. |
| CSS kullanım örneği | Oluşturulan veri URI’sini içeren background-image bildirimi. |
Görüntüden Base64’e Kodlamanın Yaygın Kullanımları
- Ek görüntü isteği olmadan küçük bir simgeyi satır içine yerleştirmek
- Çevrimdışı çalışan bağımsız bir HTML belgesi oluşturmak
- JSON veya XML yüküne görüntü eklemek
- HTML e-posta şablonu için satır içi görüntü oluşturmak
- Küçük arka plan görüntüsünü doğrudan CSS’e eklemek
- Geliştirme ve hata ayıklama için taşınabilir test verisi hazırlamak
- Ön yüz derleme sürecinin çıktısını doğrulamak
- İkili görüntü baytlarını yalnızca metin alanıyla taşımak
Base64 Görüntülerinden Ne Zaman Kaçınmalısınız?
- Büyük fotoğraflar veya kahraman görüntüleri
- Geç yüklenmesi gereken görüntüler
- Birden fazla sayfada yeniden kullanılan varlıklar
- Bağımsız tarayıcı önbelleğinden yararlanan dosyalar
- Büyük görüntüler içeren ve sık değişen HTML veya CSS
- CDN üzerinden verimli biçimde sunulan görüntüler
Görüntüden Base64’e Kodlayıcı Özellikleri
| Özellik | Ayrıntılar |
|---|---|
| Kabul edilen biçimler | PNG, JPG, JPEG, WebP, GIF ve SVG |
| Tarayıcıdaki maksimum dosya boyutu | Kullanılabilir tarayıcı ve cihaz belleğine bağlı olarak 200 MB |
| Girdi yöntemleri | Dosya seçimi, sürükleyip bırakma veya panodan yapıştırma |
| Oluşturulan çıktılar | Ham Base64, eksiksiz veri URI’si, HTML örneği ve CSS örneği |
| Kodlama davranışı | Yeniden boyutlandırma veya yeniden sıkıştırma olmadan kayıpsız bayttan metne dönüştürme |
| Animasyonlu GIF desteği | Animasyon baytları kodlanmış çıktıda korunur |
| Beklenen boyut artışı | Yaklaşık %33 ve kısa veri URI’si öneki |
| İşlem konumu | Dönüştürme için görüntü yüklemeden yerel tarayıcı belleği |
Görüntüden Base64’e Sık Sorulan Sorular
Base64 dizesi neden orijinal görüntüden daha uzundur?
Base64 her üç kaynak baytı dört metin karakteriyle temsil eder. Bu nedenle ortaya çıkan dize normalde yaklaşık %33 daha büyüktür; dolgu ve veri URI’si öneki de küçük bir ek boyut oluşturur.
Base64 kodlaması görüntü kalitesini düşürür mü?
Hayır. Base64 kayıpsızdır ve orijinal dosya baytlarını korur. Görüntüyü yeniden boyutlandırmaz, yeniden sıkıştırmaz veya görsel kalitesini değiştirmez.
Base64 veri URI’sini doğrudan tarayıcıda açabilir miyim?
Evet. Geçerli bir görüntü veri URI’sini tarayıcı adres çubuğuna yapıştırın veya kodlanmış sonucu hızla doğrulamak için görüntü kaynağı olarak ayarlayın.
Animasyonlu GIF’ler korunur mu?
Evet. Animasyon kareleri ve zamanlama verileri dahil GIF dosyasının tüm baytları kodlanır. Sonuç, animasyonlu GIF destekleyen ortamlarda hareket etmeye devam eder.
React veya Vue’da Base64 görüntüleri kullanmalı mıyım?
Base64 çok küçük varlıklar için yararlı olabilir. Daha büyük görüntüler genellikle dosya olarak içe aktarılmalı; çerçeve veya paketleyici önbelleği, dosya adlarını ve teslimatı optimize etmelidir.
SVG görüntüleri Base64 olarak kodlanmalı mı?
Yalnızca bir URL değeri gerektiğinde. HTML için doğrudan satır içi SVG işaretlemesi çoğunlukla daha küçüktür ve CSS veya JavaScript’in tek tek SVG öğelerine erişmesine olanak tanır.
Base64 güvenli bir şifreleme biçimi midir?
Hayır. Base64 geri döndürülebilir bir kodlamadır ve gizlilik sağlamaz. Dizeyi alan herkes orijinal görüntüyü yeniden oluşturabilir.
Dönüştürme sırasında görüntüm yükleniyor mu?
Hayır. Görüntü tarayıcınızdaki JavaScript tarafından yerel olarak okunur ve kodlanır; CyberTools görüntü dönüştürme uç noktasına gönderilmez.
PNG, JPG, JPEG, WebP, GIF ve SVG dosyaları için ücretsiz çevrimiçi görüntüden Base64’e dönüştürücü. Görüntünüzü yüklemeden ham Base64 dizesi, eksiksiz veri URI’si, HTML görüntü etiketi ve CSS arka plan örneği oluşturun.
İletişim
Eksik bir şey mi var?
Eksik bir araç talep edebilir veya iletişim formumuz üzerinden geri bildirim gönderebilirsiniz.
Bize Ulaşın