Favicon oluşturucu
Logodan, harflerden veya emojiden site ikonu yap ve tam seti indir: favicon.ico, iPhone ve Android ikonları, manifest ve eklenecek kod.
Tarayıcı sekmesinde
Tüm boyutlar
Dosyalar
<head> için kod
Dosyaları sitenin kök klasörüne, ana sayfanın yanına koy ve bu kodu her sayfada head etiketinin içine ekle.
Birkaç dakikada favicon
- 1Temeli seçharfler, emoji veya kendi görselin
- 2Görünümü ayarlayınrenkler, yazı tipi, köşe yuvarlama ve boyut
- 3Seti indirİkonlar, manifest ve kod içeren ZIP
Metin, emoji veya görsel
Renkli arka plan üzerinde harfler en yaygın seçenektir: adın ilk harfi 16 px'de bile okunur. Emoji, tasarımcı olmadan canlı bir ikon elde etmenin hızlı yoludur. Logo kare ve ince detaysız olmalı: 16 px'de küçük her şey birbirine karışır.
Küçük boyutu kontrol et
Önizlemeye açık ve koyu temalı sekmede bak. Simge koyu sekmede kayboluyorsa arka plan ekle veya daha parlak bir renk seç. Logo kenarlara dayanıyorsa görselin etrafındaki kenar boşlukları işe yarar.
Dosyalarla ne yapmalı
Arşivdeki tüm dosyaları sitenin kök klasörüne, ana sayfanın yanına koy ve kodu head bölümüne ekle. WordPress, Tilda ve diğer site oluşturucularda genellikle site ayarlarında favicon.ico veya 512 px PNG yüklemek yeterlidir.
Sık sorulan sorular
Yanıt bulamadınız mı? Bize yazın, yardımcı olalım.
Burada kendi ikonunu sıfırdan oluşturursun. "Site favicon'u" tersini yapar: bağlantıdan başka bir sitede zaten kullanılan ikonları bulur ve indirir.
En azından sitenin kökünde favicon.ico: tüm tarayıcılar onu arar. 32 px PNG sekmede net bir ikon verir, 180 px apple-touch-icon.png iPhone ekranında ikon sağlar, 192 ve 512 px ikonlu site.webmanifest ise Android ve PWA için gerekir.
PNG formatında üç görsel: 16, 32 ve 48 px. Tarayıcı ve Windows uygun boyutu kendisi seçer.
iOS, "Ana Ekran"daki ikonun köşelerini kendisi yuvarlar ve şeffaf alanları siyahla doldurur. Bu yüzden apple-touch-icon'u kare ve arka planlı kaydederiz: şeffaf seçtiysen beyaz arka planla.
Evet. Emoji sisteminin yazı tipiyle çizilir: iPhone'da Apple, Windows'ta Microsoft, Android'de Google tarzında. Dosyaya önizlemede gördüğün görünüm girer.
Arşivi sitenin köküne aç ve "<head> için kod" bloğundaki kodu head etiketinin içine ekle. İkon değişmediyse sayfayı önbelleksiz yenile: tarayıcılar eski faviconu uzun süre hatırlar.
Bunları da deneyin
Onlar da ücretsiz ve kayıtsız