Favicon Dönüştürücü
Tek bir tarama görüntüsünden web sitesine favicon eklemek için gereken dosyaları oluşturun. Kaynağın kare tuvale nasıl yerleşeceğini ve arka planını seçin, ardından çok boyutlu ICO, yedi PNG simgesi, web uygulaması manifest dosyası, Windows kutucuk yapılandırması ve kopyalamaya hazır head HTML kodu içeren bir ZIP indirin. Görüntü dönüştürme ve ZIP oluşturma işlemleri tarayıcınızda yerel olarak gerçekleşir.
Bir görüntüyü favicon paketine dönüştürme
-
1
Tarama görüntüsü seçin
Gösterilen dosya boyutu ve görüntü boyutu sınırlarına uyan bir PNG, JPEG veya WebP seçin. SVG, GIF ve AVIF dosyaları kabul edilmez.
-
2
Yerleşimi seçin
Kareyi doldurup kenarları kesmek için Doldur ve kırp, görüntünün tamamını koruyup çevresine boşluk eklemek için Sığdır ve boşluk ekle seçeneğini kullanın.
-
3
Arka planı ayarlayın
Şeffaf pikseller ve Sığdır ve boşluk ekle modunun oluşturduğu alan için arka plan rengi seçin, ardından oluşturulan önizlemeleri inceleyin.
-
4
İndirin ve kurun
ZIP paketini indirin, simge ve yapılandırma dosyalarını sitenize yerleştirin, sağlanan link etiketlerini belgenin head bölümüne kopyalayın.
ZIP paketinin içeriği
| Paket öğesi | Amacı |
|---|---|
favicon.ico |
Geleneksel favicon yolunu isteyen tarayıcılar ve yazılımlar için 16, 32, 48 ve 256 px girdileri içeren tek ICO konteyneri |
favicon-16x16.png |
Tarayıcı sekmeleri ve diğer küçük yerleşimler için kompakt PNG |
favicon-32x32.png |
Yüksek yoğunluklu tarayıcı sekmeleri ve yer imleri için simge |
favicon-48x48.png |
Masaüstü ve kısayollar için ek boyut |
mstile-150x150.png |
Windows kutucuk yapılandırmasının başvurduğu 150 x 150 PNG |
apple-touch-icon.png |
Apple ana ekran bağlantıları için 180 x 180 PNG |
android-chrome-192x192.png |
Web uygulaması manifest dosyasının başvurduğu 192 x 192 uygulama simgesi |
android-chrome-512x512.png |
Web uygulaması manifest dosyasının başvurduğu 512 x 512 uygulama simgesi |
site.webmanifest |
Uyumlu tarayıcıları 192 px ve 512 px simgelere yönlendiren JSON meta verisi |
browserconfig.xml |
Oluşturulan simge varlıklarına başvuran Windows kutucuk yapılandırması |
favicon-head.html |
Bir sayfayı ICO, PNG, Apple simgesi, manifest ve tarayıcı yapılandırmasına bağlayan, kopyalamaya hazır etiketler |
ICO ve PNG dosyaları bilinçli olarak ayrıdır. Tarayıcılar ve işletim sistemleri simgeleri farklı biçimde seçer. Bu nedenle eksiksiz bir paket hem geleneksel /favicon.ico isteğini hem de açık modern simge bildirimlerini karşılar.
HTML head etiketleri
İndirilen pakette şu biçimde bir kod parçası bulunur:
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="msapplication-config" content="/browserconfig.xml">
Dosyalar bir alt dizinde veya ayrı bir varlık sunucusunda bulunuyorsa etiketleri <head> bölümüne yapıştırmadan önce yolları değiştirin. site.webmanifest ve browserconfig.xml içindeki dosya adlarıyla yolları da dağıttığınız dosyalarla eşleştirin.
Doldurma, sığdırma ve arka plan seçenekleri
- Doldur ve kırp her kare çıktıyı tamamen doldurur. Geniş veya uzun bir kaynağın karşılıklı kenarlarından eşit miktar kırpılır, bu yüzden önemli çizimleri merkeze yakın tutun.
- Sığdır ve boşluk ekle kaynağın tamamını görünür tutar. Kullanılmayan alan, seçilen arka plan renginde boşluk olur.
- Arka plan şeffaf kalabilir veya özel bir düz renk kullanabilir. Sığdır ve boşluk ekle modunda bu seçim görüntünün çevresindeki alanı da belirler. Yayımlamadan önce önizlemeleri hem açık hem koyu sayfa temalarında kontrol edin.
Küçük simgeleri olabildiğince net elde etmek için en az 512 x 512 piksel boyutunda, basit ve kare bir görüntüyle başlayın. Kaynak büyük olsa bile ince yazılar, çok ince çizgiler ve küçük ayrıntılar 16 px sürümünde kaybolabilir.
Girdi sınırları ve dosya yerleşimi
Bu dönüştürücü yalnızca PNG, JPEG ve WebP tarama görüntülerini kabul eder. Görüntü imzasını denetler ve SVG, GIF, AVIF ile listelenmeyen diğer biçimleri reddeder. Her kaynak en fazla 20 MiB olabilir; hiçbir kenar 8.192 pikseli, toplam çözünürlük ise 24 megapikseli aşamaz. Boyut sınırları, görüntünün tamamı çözülmeden önce kontrol edilir.
İndirdikten sonra ZIP paketini çıkarın ve oluşturulan dosyaları sağlanan kodun kullandığı yollara yükleyin. /favicon.ico gibi kökten başlayan yollar, dosyaların geçerli alan adının kökünden sunulduğunu varsayar. Tarayıcılar simge dosyalarını sıradan sayfa varlıklarından daha uzun süre saklayabildiği için mevcut bir faviconu değiştirirken site veya CDN önbelleğini temizleyin.
Paketteki manifest simge meta verilerini sağlar ancak tek başına bir manifest ve simge seti, siteyi kurulabilir bir progresif web uygulaması yapmaz. Kurulabilirlik ayrıca sayfaya, aktarım güvenliğine ve her tarayıcının gereksinimlerine bağlıdır.
Sık Sorulan Sorular
PNG, JPEG veya WebP kullanabilirsiniz. Dönüştürücü yalnızca dosya adına güvenmek yerine dosya imzasını kontrol eder; SVG, GIF, AVIF ve diğer biçimleri reddeder.
Doldur ve kırp, kare dolana kadar görüntüyü ölçekler ve en boy oranı kare değilse karşılıklı kenarlardan eşit miktar keser. Sığdır ve boşluk ekle görüntünün tamamını korur, kalan kare alanı seçilen arka plan rengiyle doldurur.
ICO, birkaç küçük simge boyutunu geleneksel tek bir favicon dosyasında saklayabilen bir konteynerdir. Ayrı PNG dosyaları tarayıcılara ve platformlara sekmeler, ana ekran bağlantıları ve uygulama simgeleri için açıkça boyutlandırılmış varlıklar verir. İkisini birlikte kullanmak pratik uyumluluğu artırır.
Hayır. Manifest, oluşturulan uygulama simgelerini ve ilgili görüntüleme meta verilerini açıklar. Kurulabilirlik ise ek tarayıcı gereksinimlerine ve sitenin nasıl oluşturulup sunulduğuna bağlıdır.
Sağlanan kod kökten başlayan yollar kullanır, bu yüzden en kolay yöntem çıkarılan dosyaları alan adının köküne yerleştirmektir. Başka bir klasör veya varlık sunucusu kullanıyorsanız kodu, manifest dosyasını ve tarayıcı yapılandırmasındaki yolları buna göre güncelleyin.
Hayır. Görüntü işleme ve ZIP oluşturma işlemleri tarayıcınızda gerçekleşir. Çok adımlı akışta, görüntüyü adımlar arasında taşımak amacıyla bu tarayıcıda bir IndexedDB taslağı en fazla 30 dakika saklanabilir. Bu yerel aktarım sunucuya yükleme değildir.
İlgili Araçlar
QR Kod Okuyucu
PNG, JPG veya WebP görüntüsünden QR kodu tarayıcıda çözün. URL, Wi-Fi, vCard, SMS, e-posta, takvim, geo veya metni kullanmadan önce görün.
GIF Oluşturucu
Bir görsel dizisini veya kısa videoyu animasyonlu GIF’e dönüştürün. Dışa aktarmadan önce kare hızı, döngü sayısı ve boyutu ayarlayın.
Görüntü Büyütücü
Düşük çözünürlüklü görüntüleri yapay zekâ süper çözünürlüğü veya klasik interpolasyonla 2×, 3× ya da 4× büyütün ve önemli ayrıntıları koruyun.
QR Kod Oluşturucu
Metin veya URL’den tarayıcıda QR kod oluşturun ve PNG olarak indirin.
Barkod Üretici
Code 128, Code 39, EAN-13, UPC-A, ITF-14 ve Codabar biçimlerinde taranabilir 1D barkodlar oluşturun. Baskı için PNG, SVG veya PDF olarak dışa aktarın.
Meme oluşturucu
Drake, Distracted Boyfriend veya Doge gibi popüler şablonlarla ya da kendi görselinizle meme oluşturun. Impact yazı tipi, kontur ve gölgeli üst/alt metin.