Favicon ve uygulama ikonu oluşturucu
Logo yükleyin, birçok boyutta ikon önizlemesi yapın, PNG indirin ve siteniz veya PWA için HTML parçasını kopyalayın.
İkon önizlemesi
O boyutu PNG olarak indirmek için bir ikona veya etiketine tıklayın. Dosyaları projenize kaydedin (örn. /assets/icons).
Bu oluşturucu tamamen tarayıcınızda çalışır. İndirilen PNG'leri yüklemeyi ve parçadaki yolları projenize göre güncellemeyi unutmayın.
Her ciddi projenin tarayıcı sekmesinde net bir favicon, iOS için Apple touch ikonu ve Android ile PWA için uygulama ikonlarına ihtiyacı vardır. Bu araç hepsini tek bir görselden üretmenize yardım eder: kare bir logo yükleyin, boyutları seçin, PNG'leri indirin ve HTML parçasını sitenize kopyalayın.
Favicon ve uygulama ikonları neden önemli
- Favicon — tarayıcı sekmesindeki ve yer imlerindeki küçük ikon. Olmadan sekme sıradan görünür ve markanız daha az tanınır.
- Apple touch ikonu — kullanıcı sitenizi iPhone ve iPad'de ana ekrana eklediğinde kullanılır. Doğru boyut (örn. 180×180) net bir ikon sağlar.
- PWA / Android ikonları — "Ana ekrana ekle" ve kurulum için gerekir. Tipik boyutlar: 192×192 ve 512×512.
Tek bir kare kaynak görsel hepsini karşılayabilir. Oluşturucu tamamen tarayıcınızda çalışır; logonuz cihazınızdan ayrılmaz.
Önerilen kaynak görsel
En az 512×512 piksel kare bir görsel (PNG veya SVG) kullanın. Daha yüksek çözünürlük uygundur; araç küçültür. İkonların yüksek yoğunluklu ekranlarda net kalması için çok küçük veya bozuk görsellerden kaçının.
Araçla hızlı başlangıç
- Yükle — "Dosya seç"e tıklayıp logonuzu seçin (PNG veya SVG, kare, 512×512 veya daha büyük).
- Arka plan — Logonuz şeffaf alan içeriyorsa arka plan rengi seçin; snippet'ta
theme-colorolarak da kullanılır. - Boyutlar — İhtiyacınız olan boyutları işaretleyin (favicon 16/32, Apple 180, PWA 192/512 vb.).
- İndir — Bir önizlemeye tıklayarak o boyutu PNG olarak indirin veya hepsini bir seferde almak için "Tümünü ZIP olarak indir"i kullanın.
- Parça — HTML bloğunu kopyalayıp sitenizin
<head>bölümüne yapıştırın. PNG'leri sunucuya yükleyin (örn./assets/icons/) ve gerekirse snippet'taki yolları güncelleyin.
Dosyaları nereye koymalı
Yaygın bir düzen:
- Favicon ve ikon PNG'lerini
/assets/icons/gibi bir klasöre veya köke koyun. - Snippet'taki
hrefdeğerlerini bu yollara yönlendirin (örn./assets/icons/favicon-32x32.png). - PWA için 192×192 ve 512×512 ikonlarına aynı yollarla bir
site.webmanifestekleyin.
Özet
Favicon ve uygulama ikonu oluşturucu, tek bir logodan tüm gerekli boyutları ve <head> için hazır bir parça üretmenizi sağlar. İyi çözünürlükte kare bir görsel kullanın, PNG'leri indirin ve parçayı projenize ekleyin.
- Kare bir görsel yükleyin (PNG veya SVG, en az 512×512 önerilir).
- Arka plan rengini ve oluşturulacak ikon boyutlarını seçin (favicon, Apple touch, PWA).
- Her PNG'yi indirmek için bir önizlemeye tıklayın, ardından HTML parçasını sitenizin <head> bölümüne kopyalayın.
Sıkça Sorulan Sorular
İlgili araçlar
Bu araç yalnızca kişisel ve eğitim amaçlı kullanım için sağlanmaktadır. Sunucularımızda herhangi bir kullanıcı içeriği veya medya dosyası barındırmıyoruz ya da saklamıyoruz. Tüm işlemler tarayıcınızda yerel olarak gerçekleşir. Belirtilen hiçbir sosyal ağ, platform veya şirketle bağlantımız yoktur ve onlar tarafından desteklenmiyoruz. Bu hizmeti kendi sorumluluğunuzda ve ilgili platformun hizmet koşullarına uygun olarak kullanın.