SVG'yi ICO'ya Dönüştürme

Favicon için en iyi başlangıç noktası SVG'dir: her simge boyutu büyük bir bitmap'ten küçültülmek yerine vektörden yeniden çizilir, böylece 16 px sürüm bile piksel ızgarasının izin verdiği kadar net kalır.

veya JPG, JPEG, JPE … dosyaları buraya bırakın ·

Dosya başına en fazla 95 MB· En fazla 20 dosya· 30 dakika sonra silinir

Çıktı

Dönüştürülecek biçim

Dosyalar sunucularımızda işlenir ve 30 dakika sonra silinir.

Bu aracı nasıl kullanırsınız

1
SVG logonuzu yükleyin
Tam yazı logosunu değil, simgeyi veya monogramı kullanın. Kare bir viewBox en temiz sonucu verir.
2
Tüm simge boyutlarını koruyun
Simge boyutları varsayılan olarak Tüm boyutlar (16–256) seçili gelir; bu seçenek tüm çözünürlükleri tek bir .ico dosyasına koyar. Yalnızca bir program tam olarak tek bir boyut istiyorsa tek boyut seçin.
3
ICO biçimine Dönüştür düğmesine basın
Dosyayı sitenizin kök klasörüne favicon.ico adıyla kaydedin veya bir Windows kısayolunu bu dosyaya yönlendirin.

Yanıt

Favicon için SVG'yi ICO'ya nasıl dönüştürürüm?

SVG'yi yükleyin, Simge boyutları ayarını Tüm boyutlar (16–256) olarak bırakın ve ICO biçimine Dönüştür → düğmesine basın. Her çözünürlüğün vektörden çizildiği, saydamlığı korunmuş tek bir .ico dosyası elde edersiniz.

SVG'yi ICO'ya dönüştürme: neden doğru kaynak vektördür

Bu .ico biçimi Windows'un ilk sürümlerine, favicon.ico geleneği ise 1999'daki Internet Explorer 5'e dayanır; o sürüm, yer imine eklediğiniz her sitenin kökünde bu adı taşıyan bir dosya arıyordu. ICO küçük bir kapsayıcıdır: her biri ayrı bir kare bitmap olan girdilerden oluşan bir dizindir; bu sayede tek dosya 16 px'lik sekme simgesini ve 256 px'lik masaüstü simgesini yan yana taşıyabilir. Windows Vista azami boyutu 256 × 256'ya çıkardı ve bu büyük girdilerin PNG olarak saklanmasına izin verdi.

Her girdi ayrı bir bitmap olduğundan simgenin kalitesi, her boyutun nasıl üretildiğine bağlıdır. PNG'den üretildiğinde her boyut aynı piksellerin küçültülmüş hâlidir. SVG'den üretildiğinde her boyut, yolların yeniden çizilmesiyle elde edilir ve kenar yumuşatma tam o ızgaraya göre hesaplanır. Bir logonun çalışabileceği 256 pikselin bulunduğu 16 × 16 px'te bu fark gözle görülür.

1:1

16 × 16 px

16 × 16

Tarayıcı sekmeleri, yer imleri ve geçmiş listeleri.

1:1

32 × 32 px

32 × 32

Yüksek yoğunluklu ekranlardaki sekmeler, Windows görev çubuğu kısayolları.

1:1

64 × 64 px

64 × 64

Ölçeklenmiş masaüstü görünümleri ve sabitlenmiş öğeler.

1:1

128 × 128 px

128 × 128

Dosya yöneticilerindeki büyük önizlemeler.

1:1

256 × 256 px

256 × 256

En büyük ICO girdisi; Gezgin'in çok büyük simgeleri.

SVG

Scalable Vector Graphics

SVG, W3C'nin 2001'de standartlaştırdığı XML tabanlı bir vektör biçimidir. Piksel yerine şekilleri, yolları ve metni tanımlar; bu yüzden her boyutta keskin kalır ve logolar ile simgeler için genellikle çok küçüktür. Saydamlığı, CSS stillendirmesini, betik çalıştırmayı ve animasyonu destekler; her tarayıcı onu yerel olarak işler. SVG fotoğraflar için uygun değildir ve karmaşık çizimlerin işlenmesi yavaşlayabilir. Illustrator, Inkscape, Figma ve tarayıcılar onu açıp düzenleyebilir.

Sıkıştırma: –
Saydamlık: Evet
Animasyon: Evet
Çıkış yılı: 2001 · W3C

SVG dönüştürücü

ICO

Windows simgesi

ICO, Windows program simgeleri ve web sitesi favicon'ları için kullanılan Microsoft simge biçimidir. Tek bir .ico dosyası 16×16, 32×32, 48×48 ve 256×256 piksel gibi farklı boyutlarda birkaç resim içerebilir; böylece sistem en uygun olanı seçer. Her resim bitmap veya PNG verisi olarak saklanabilir ve tam alfa saydamlığını destekler. ICO fotoğraflar veya büyük çizimler için tasarlanmamıştır. Tarayıcılar, Windows ve çoğu simge düzenleyici okuyabilir.

Sıkıştırma: Kayıpsız
Saydamlık: Evet
Animasyon: Hayır
Çıkış yılı: Microsoft

ICO dönüştürücü

İnsanlar SVG'yi ICO'ya dönüştürür; çünkü logoları vektör olarak vardır, ancak web sitesi kökü, Windows kısayolu veya masaüstü uygulaması hâlâ birkaç bitmap boyutunu içeren tek bir .ico dosyası bekler.

SVG'yi ICO'ya dönüştürmeden önce dosyayı hazırlayın

Yapın	Yapmayın
viewBox'ı `0 0 512 512` gibi bir kareye ayarlayın.	32 px'in altında kaybolan çok ince çizgilere güvenmeyin.
Simge, kenara değmesin diye küçük bir boşluk bırakın.	İnce bir lekeye dönüşen geniş bir yazı logosunu bırakmayın.
Yazı tipi değişmesin diye metni dış çizgilere dönüştürün.	SVG içinde harici resimlere veya web yazı tiplerine başvurmayın.
Tam adı değil, sembolü veya baş harfleri kullanın.	Koyu sekmelerde de görünmesini istemiyorsanız logonun arkasına beyaz dikdörtgen eklemeyin.

Dönüştürücü yalnızca SVG'nin tanımladığını çizer; bu yüzden bağlantılı varlıklar ve gömülü olmayan yazı tipleri getirilemez. Figma, Illustrator ve Inkscape gibi tasarım araçları metni yol olarak dışa aktarabilir; bunu yaparsanız harfler her yerde markanızla birebir aynı görünür.

.ico hazır olduktan sonra Apple dokunmatik simgeleri için 180 px'lik bir PNG ve vektör favicon destekleyen tarayıcılar için SVG'nin kendisini ekleyin; PNG'yi istediğiniz boyutta SVG'den PNG'ye aracı üretir. Kaynağınız bitmap bir logoysa aynı işi pikselden PNG'den ICO'ya aracı yapar.

SVG'yi ICO'ya dönüştürme: sık sorulan sorular

Neden PNG yerine SVG'den ICO'ya dönüştürme yapmalıyım?

PNG, her simge boyutu için küçültülmek zorundadır ve küçültme kenarları bulanıklaştırır. SVG ise 16, 32, 64, 128 ve 256 px boyutlarında doğrudan oluşturulur; böylece her boyut kendi piksel ızgarasına göre keskin kenarlar alır.

Sitemde SVG simge varsa tarayıcılar yine de favicon.ico'ya ihtiyaç duyar mı?

Chrome ve Firefox, link etiketiyle tanımlanmış SVG favicon'u okur; ancak birçok tarayıcı, haber okuyucu ve tarayıcı bot hâlâ varsayılan olarak site kökünden /favicon.ico dosyasını ister. İkisini birlikte sunmak her durumu kapsar.

SVG dosyam kare değilse ne olur?

Simge alanları karedir; bu yüzden geniş bir logo ya boş kenar boşlukları alır ya da çok küçük görünür. Önce viewBox'ı genişlik ve yükseklik eşit olacak şekilde düzenleyin veya PNG olarak dışa aktardıktan sonra resim kırpma aracıyla kare bir sürüm kırpın.

Şeffaf arka plan ICO dosyasında korunur mu?

Evet. ICO alfa kanalını saklar; bu yüzden SVG'de dolgusu olmayan alanlar saydam kalır ve simge açık ve koyu tarayıcı sekmelerinde temiz görünür.

Windows programı veya klasör simgesi için SVG'yi ICO'ya dönüştürebilir miyim?

Evet, aynı dosya çalışır. Windows, Gezgin'in büyük ve çok büyük görünümlerinde 256 px görüntüyü, listelerde ve görev çubuğunda daha küçük girdileri kullanır.

Simgem 16 px'te neden boş görünüyor?

İnce çizgiler ve küçük yazılar bu boyutta kaybolur. 512 birimlik bir çalışma alanındaki 2 birimlik çizgi, 16 px'lik bir simgede bir pikselin çok altında kalır. Çizgileri kalınlaştırın veya favicon için daha sade bir simge kullanın.

SVG'yi ICO'ya Dönüştürme

Resim Dönüştürücü