Next.js için site simgesi
Next.js 14+ Uygulama Yönlendiricisi /app/icon.png ve /app/favicon.ico'i kural olarak kabul eder; bunları bırakın ve Next otomatik olarak doğru etiketleri yayınlar.
Check favicons on any website
Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.
favicon.ico'i /app içine yerleştirin ve Sonraki bunu /favicon.ico'te sunacak ve bağlantı etiketini enjekte edecektir.
Çok boyutlu veya temalı simgeler için dosya kurallarını kullanın: /app içindeki icon.png, icon.svg, apple-icon.png. Daha sonra dosya meta verisinden <link> etiketlerini oluşturur.
Nasıl çalışır
- 1
favicon.ico oluştur
512×512 kaynaktan çok boyutlu 16/32/48/64.
- 2
/app içine yerleştirin
/app/favicon.ico otomatik olarak sunulur. HD için icon.png'yi ekleyin.
- 3
Doğrulamak
Tarayıcınızda /favicon.ico'i açın - Sonraki, herhangi bir yapılandırma olmadan bunu sunar.
Hemen deneyin
Next.js'e hazır bir sık kullanılan simgesi oluşturun
Favicon OluşturucuSSS
Next.js Uygulama Yönlendiricisinde simgeler nereye gider?+
/app dizininin içinde. Dosya adı (simge, elma simgesi, favicon) rolü belirler.
Peki Sayfa Yönlendiricisi?+
favicon.ico'i /public'e bırakın ve _document.tsx'ten bağlayın.
Yine de çok boyutlu bir .ico dosyasına ihtiyacım var mı?+
Eski tarayıcı desteği, özellikle Edge ve IE modu kısayolları için önerilir.
İlgili araçlar
Favicon Oluşturucu
Her cihaz ve tarayıcı için eksiksiz bir favicon paketi (ICO + PNG) oluşturun.
PNG'den ICO'ya Dönüştürücü
Windows ikonları, uygulama simgeleri ve web sitesi favicon'ları için ücretsiz online PNG'den ICO'ya dönüştürücü.
SVG'den PNG'ye Dönüştürücü
SVG vektör grafiklerini her çözünürlükte PNG olarak işleyin.