PNG → ICO
Favicon oluşturucu
Bir web sitesinin ihtiyaç duyduğu tüm simgeleri tek bir görselden oluşturun: favicon.ico, Apple touch icon, uygulama simgeleri ve yapıştırılacak HTML. Hepsi tarayıcınızda yapılır.
apple-touch-icon.png · 180
icon-192.png · 192
icon-512.png · 512
Sitenizin <head> bölümüne yapıştırın
Tarayıcınızda çalışır · dosyalar cihazınızda kalır
Favicon oluşturma adımları
- Logonuzu ya da simgenizi ekleyin. PNG, JPG veya SVG. En iyi sonucu basit şekilli kare bir görsel verir.
- Kenar boşluğunu, köşeleri ve arka planı ayarlayın. Simgenin çevresine boşluk ekleyin, köşeleri yuvarlatın ve logonuz şeffaf zemin üzerinde koyuysa arka planı doldurun.
- Tarayıcı sekmelerini kontrol edin. Önizleme simgeyi açık ve koyu bir sekmede gerçek 16 px boyutunda gösterir.
- ZIP'i indirin ve HTML'yi yapıştırın. Dosyaları sitenizin kök dizinine yükleyin ve etiketleri
<head>bölümüne yapıştırın.
Favicon generator neler oluşturur
| Dosya | Boyut | Kullanan |
|---|---|---|
| favicon.ico | 16, 32 ve 48 px | Tarayıcı sekmeleri, yer imleri, Windows kısayolları ve /favicon.ico isteyen her araç |
| icon.svg | Ölçeklenebilir | Kaynak görseliniz SVG olduğunda modern tarayıcılar |
| apple-touch-icon.png | 180 px | iPhone ve iPad ana ekran kısayolları |
| icon-192.png ve icon-512.png | 192 ve 512 px | Android ve yüklenen web uygulamaları, manifest'te listelenir |
| manifest.webmanifest | – | Tarayıcılara uygulama simgelerinin yerini bildirir |
192 ve 512 px simgeler, web.dev üzerindeki web uygulaması manifest örneğini izler. Apple touch icon her zaman dolu bir arka planla hazırlanır, çünkü iOS şeffaf alanları siyah gösterir.
Görselden ya da PNG'den favicon oluşturma
Logonuzun elinizdeki en temiz sürümüyle başlayın. Favicon bir sekmede 16 × 16 piksel gösterilir; ince yazılar ve ince çizgiler kaybolur. Birçok marka yalnızca sembolünü ya da baş harfini kullanır. Kaynak görsel kare değilse oluşturucu onu şeffaf kenar boşluklarıyla kare bir tuvalin ortasına yerleştirir.
Logo kenarlara değiyorsa kenar boşluğu kaydırıcısını kullanın. Logo koyu ve şeffafsa arka planı doldurun ki koyu tarayıcı sekmelerinde de görünür kalsın.
SVG'den favicon oluşturucu
Bir SVG bırakırsanız set onu icon.svg olarak içerir ve HTML onu ek bir simge olarak tanımlar. SVG favicon'u destekleyen tarayıcılar onu her boyutta kullanır, diğerleri favicon.ico'ya döner. PNG simgeler vektörden çizildiği için keskin çıkar.
Favicon generator ve Google Arama
Google, favicon'unuzu arama sonuçlarınızın yanında gösterebilir. Yönergeleri en az 8 × 8 piksellik kare bir görsel ister ve 48 × 48 pikselden büyük bir görsel önerir (Google Search Central). favicon.ico içindeki 48 px boyut ve 192 px simge bunu karşılar. Daha fazla ayrıntı için favicon boyutu rehberimize bakın.