Favicon Oluşturucu: favicon.ico, PNG ve Apple Touch Simgeleri Oluşturun
Görselden veya metinden tarayıcınızda favicon.ico, PNG favicon'lar, Apple touch simgesi ve web uygulaması manifesti oluşturun, HTML etiketlerini kopyalayın.
Bir görseli buraya bırakın veya seçin
PNG, JPG, WebP, GIF (ilk kare), BMP veya SVG. En az 512 × 512 piksellik kare bir görsel en iyi sonucu verir.
Metin, bu cihazda yüklü yazı tipleriyle çizilir; bu nedenle harfler ve emojiler başka bir bilgisayarda veya telefonda farklı görünebilir. İndirilen PNG ve ICO dosyaları burada gördüğünüz görünümü korur.
Önizleme
16, 32 ve 48 gerçek boyutlarında gösterilir; daha büyük simgeler küçültülerek gösterilir. Damalı desen saydam alanları belirtir.
Tarayıcı sekmesinde
Açık ve koyu temada basitleştirilmiş bir sekme çubuğu. Simgenin ikisinde de görünür olduğunu kontrol edin: saydam arka plan üzerindeki koyu bir logo, koyu sekme çubuğunda kaybolabilir.
Dosyalar
Bazı Apple cihazları ana ekran simgesinin saydam kısımlarını siyah gösterir; bu nedenle apple-touch-icon.png saydamlık olmadan kaydedilir: saydam alanlar bu renkle doldurulur. iPhone ve iPad ana ekran simgelerinin köşelerini kendileri yuvarlattığı için şekil ayarı bu dosyaya uygulanmaz.
HTML etiketlerinde ve manifestte kullanılır. "/" web sitesinin kök klasörü anlamına gelir.
Arka plan, şekil, iç boşluk ve kırpma ayarları favicon.svg dosyasına uygulanmaz.
Tarayıcılar tema rengini adres çubuğunu veya pencere başlığını renklendirmek için kullanabilir. Uygulama arka plan rengi, yüklü bir web uygulaması açılırken gösterilir.
Başlamak için bir görsel seçin veya metne geçin.
site.webmanifest içeriği
Notlar
- Dosyaları web sitenizin kök klasörüne (ana sayfayı içeren klasöre) yükleyin ya da HTML'deki ve manifestteki yolların eşleşmesi için yukarıya başka bir klasör girin.
- favicon.ico, PNG verisi olarak saklanan 16 × 16, 32 × 32 ve 48 × 48 piksellik görseller içerir. Güncel tarayıcılar ve Windows Vista veya sonraki sürümler bunu okuyabilir; bazı çok eski programlar yalnızca sıkıştırılmamış simge görsellerini okur.
- 64 × 64 piksellik bir görsel gibi küçük kaynaklar, daha büyük simgeler için büyütülür ve bulanık görünür. Mümkünse en az 512 × 512 piksellik bir görsel veya bir SVG dosyası kullanın.
- Metin simgeleri, simgeyi oluşturduğunuz cihazda yüklü yazı tiplerini kullanır. PNG ve ICO dosyaları bu görünümü korur, ancak simgeyi başka bir cihazda yeniden oluşturmak farklı bir sonuç verebilir.
- SVG dosyaları tarayıcınız tarafından çizilir. Bir SVG dosyasının başka dosyalardan veya web sitelerinden yüklediği görseller, yazı tipleri veya stiller yüklenmez ve simgelerde eksik olabilir.
- Tarayıcılar favicon'ları uzun süre önbellekte tutar. Bir favicon'u değiştirdikten sonra eskisi bir süre daha görünebilir; sert yenileme, gizli pencere veya HTML'de dosya adını değiştirmek işe yarayabilir.
- Görseller ve metinler tarayıcınızda işlenir ve LeedyBox'a yüklenmez.
Nasıl kullanılır
- Görsel seçeneğini belirleyip logonuzu seçin veya bırakın ya da Metin veya emoji seçeneğini belirleyip en fazla üç karakter yazın.
- Arka planı, şekli ve iç boşluğu ayarlayın; önizlemeleri ve tarayıcı sekmesini açık ve koyu temada kontrol edin.
- İsterseniz web sitesi adını, kısa adı, tema rengini ve dosyaların saklanacağı klasörü girin.
- "Favicon dosyalarını oluştur" düğmesine basın, ardından dosyaları tek tek ya da hepsini birlikte favicon-package.zip olarak indirin.
- Dosyaları web sitenize yükleyin ve kopyaladığınız HTML etiketlerini sayfalarınızın head bölümüne yapıştırın.
Sık sorulan sorular
Görsellerim bir sunucuya yükleniyor mu?
Hayır. Görsel veya metin tarayıcınızda çizilir ve dönüştürülür; dosyalar cihazınızda oluşturulur. LeedyBox'a hiçbir şey gönderilmez. Sayfa yüklenirken yalnızca ZIP kitaplığı indirilir; o da doğrudan leedybox.com'dan.
Hangi görselleri kullanabilirim, sınırlar var mı?
PNG, JPG, WebP, GIF (ilk kare), BMP ve SVG dosyaları. SVG dosyaları en fazla 10 MB olabilir. Çok büyük fotoğraflar (yaklaşık 50 megapikselin üzeri) gerektirdikleri bellek nedeniyle telefonlarda başarısız olabilir. En az 512 × 512 piksellik kare bir görsel veya bir SVG dosyası en net sonucu verir.
Favicon'um neden bulanık veya zor okunur görünüyor?
16 piksellik bir simgede çok az yer vardır. Basit şekiller, güçlü kontrast ve bir ya da iki harf, ayrıntılı logolardan veya uzun metinlerden daha iyi sonuç verir. Küçük kaynak görseller büyük boyutlar için büyütülür ve bulanık görünür. Önizlemeleri kontrol edin; daha az iç boşluk veya logonuzun daha sade bir sürümünü deneyin.
Bu dosyalardan hangilerine ihtiyacım var?
favicon.ico ile 16 ve 32 piksellik PNG dosyaları masaüstü tarayıcılar, apple-touch-icon.png ise iPhone ve iPad tarafından kullanılır. 192 ve 512 piksellik simgeler ile site.webmanifest, site ana ekrana eklendiğinde veya web uygulaması olarak yüklendiğinde kullanılır. Hepsini HTML etiketleriyle birlikte kullanmak yaygın durumları karşılar.
apple-touch-icon.png neden saydamlık içermiyor?
Bazı Apple cihazları ana ekran simgesinin saydam kısımlarını siyah gösterir. Bu nedenle araç saydam alanları seçtiğiniz renkle (varsayılan olarak beyaz) doldurur ve köşeleri kare bırakır, çünkü iPhone ve iPad köşeleri kendileri yuvarlatır.