Nasıl kullanılır?
- Simge kaynağı olarak Bir resim ya da Bir renk üzerinde harfler ya da emoji seçin.
- Resmi seçin ya da Harfler ya da emoji kutusuna yazın. Arka plan rengi ve Harf rengini belirleyin.
- Tema rengi ve Site adını girin, ardından Simgeleri oluştur düğmesine tıklayın.
- ZIP dosyasını indirin. Dosyaları sitenizin en üst klasörüne koyun ve HTML etiketlerini her sayfanın head bölümüne yapıştırın.
Dosyalar ve boyutları
favicon.ico üç resim taşır: 16, 32 ve 48 piksel. Böylece tarayıcı sekmesi, yer imi ve Windows her biri için uygun boyutu bulur. apple-touch-icon.png iPhone ve iPad ana ekranı için 180 pikseldir. android-chrome-192x192.png ve android-chrome-512x512.png, manifestte listelenen Android simgeleridir. site.webmanifest uygulamanın adını ve renklerini verir.
Saydamlık ve arka plan
favicon saydam alanlarını korur; logonuz tarayıcının gösterdiği zemin üzerinde durur. Apple ve Android simgeleri arka plan rengiyle doldurulur, çünkü bir Apple simgesinin saydam köşesi iPhone ve iPad'de siyah görünür.
Dosyalar nereye konur?
Dosyaları sitenizin en üst klasörüne koyun ki /favicon.ico ve /site.webmanifest adresleri çalışsın. Tarayıcılar simgeleri uzun süre önbellekte tutar; değişiklikten sonra bağlantıya bir sürüm numarası ekleyin ya da yeni simgeyi görmek için önbelleği temizleyin.
Örnek: koyu mavi üzerinde FT harfleri
Bir renk üzerinde harfler ya da emoji seçin, FT yazın ve koyu mavi arka planı bırakın. Araç harfleri yuvarlatılmış bir karenin ortasına çizer ve kareye sığdırır; böylece harfler 16 piksellik simgede bile okunur.
Sık sorulan sorular
Simgeleri hazırlarken resmim yüklenir mi?
Hayır. Simgeler tarayıcınızda çizilir ve ZIP dosyasına cihazınızda konur. Sayfa açıldıktan sonra internet bağlantınızı kapatıp bir simge seti oluşturarak bunu kendiniz görebilirsiniz.
Tarayıcı sekme simgesi için hangi dosyayı kullanır?
Tarayıcılar favicon.ico dosyasını ya da sayfadaki bir PNG ya da SVG dosyasına işaret eden bağlantı etiketini kullanır. Bu aracın etiketleri favicon.ico ve Apple simgesini gösterir; böylece her tarayıcı uygun boyutta bir simge bulur.
favicon'um 16 pikselde neden bulanık görünüyor?
Küçük bir simgenin pikseli çok azdır; ince çizgiler ve küçük harfler bulanıklaşır. Kalın çizgili basit bir şekil ya da en fazla iki harf kullanın ve ICO dosyasındaki 16 ve 32 piksellik resimleri kontrol edin.
Apple simgelerinin neden bir arka plan rengi var?
Saydam köşeli bir Apple simgesi iPhone ve iPad'de o köşeyi siyah gösterir. Araç, seçtiğiniz arka plan rengiyle tüm kareyi doldurur.
Sayfanın head bölümüne ne konur?
HTML etiketleri kutusundaki satırları her sayfanın head bölümüne yapıştırın. Bu satırlar favicon.ico dosyasını, Apple simgesini, manifesti ve tema rengini bağlar.
Manifest nasıl kullanılır?
site.webmanifest dosyasını sitenizin en üst klasörüne koyun. Ziyaretçi siteyi uygulama olarak yüklediğinde tarayıcı bunu okur; uygulamanın adını, kısa adını, renklerini ve iki Android simgesini içerir.
Kaynaklar
- MDN: link öğesi; simge ve manifest bağlantıları
- MDN: Web uygulama manifesti
- Microsoft Learn: Icons; ICO dosyasının ICONDIR ve ICONDIRENTRY yapıları
Rakamlar ve metin en son 10 Kasım 2026 Salı tarihinde kontrol edildi.