Favicon generator

Favicon Generator

Turn one image into a complete favicon package — favicon.ico, all PNG sizes, apple-touch-icon, Android icons, a manifest, and the HTML — in a single zip.

favicon.ico + PNGs100% freeNo sign-upPNG · JPG · WebP · SVG

Favicon oluşturmak için bir görüntü bırakın

Sürükleyip bırakın, yapıştırın veya dosya seçin

PNG · JPG · WebP · SVG — ikonlar cihazınızda oluşturulur

One image in, a full favicon set out

A modern favicon is not a single file — browsers, iOS, Android, and installable PWAs each want their own sizes and formats. This generator takes one square-ish image and produces the whole set: a favicon.ico with 16, 32, and 48 px, standalone PNG favicons up to 512 px, a 180 px apple-touch-icon, 192 and 512 px Android icons, a site.webmanifest, and a copy-paste HTML snippet.

Everything is rendered on your device with the canvas API, then bundled into a zip you download. Add a background color, padding, or rounded corners if your artwork needs a little breathing room inside the icon frame.

How to generate a favicon

  1. Add your image — drag & drop, paste, or choose a PNG, JPG, WebP, or SVG.
  2. Adjust the look — keep it transparent or pick a background, and tweak padding and corner rounding.
  3. Preview every size — check the live 16–512 px previews so nothing looks muddy when small.
  4. Download the zip — get favicon.ico, the PNGs, the manifest, and the HTML, then paste the snippet into your <head>.

Tip: design for the smallest size

At 16×16 a detailed logo turns to mush. Use a bold, simple mark with strong contrast, and add a little padding so the artwork is not clipped by rounded tab corners.

eksiksiz favicon seti: sizes and where each is used

Modern bir favicon tek bir dosya değil, küçük bir settir; çünkü tarayıcılar, iOS, Android ve kurulabilir PWA'ların her biri farklı bir boyut ve biçim arar. İşte tam olarak ne üretildiği ve her parçanın nerede kullanıldığı.

Size File Where it's used
16 × 16 px favicon.ico + favicon-16x16.png Standart (1×) ekran yoğunluğunda tarayıcı sekmesi ve adres çubuğu simgesi; en küçük ve en çok görülen boyut.
32 × 32 px favicon.ico + favicon-32x32.png Yüksek DPI (Retina) ekranlarda sekme ve yer imi simgesi ile Windows görev çubuğu kısayolu.
48 × 48 px favicon.ico + favicon-48x48.png Daha büyük bir boyut seçen masaüstü kısayolları ve Windows site kutucukları için favicon.ico içine paketlenir.
180 × 180 px apple-touch-icon.png Bir site iPhone veya iPad ana ekranına eklendiğinde iOS Safari'nin gösterdiği simge.
192 × 192 px android-chrome-192x192.png Kurulu bir PWA için Android ana ekran / başlatıcı simgesi; web manifestinde listelenir.
512 × 512 px android-chrome-512x512.png PWA açılış ekranı ve yüksek çözünürlüklü uygulama simgesi; manifestin maskelenebilir simgesi olarak da kullanılır.

Format & container

Önemli olan üç biçimin tümünü alırsınız: eski sistemler ve Windows için çok boyutlu bir .ico, modern tarayıcılar için keskin PNG'ler ve PWA kurulumları için manifest simgeleri — böylece tek bir yükleme her şeyi kapsar.

How it's wired into your page

                <link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
              

Tip

Önce 16 × 16 için tasarlayın: ayrıntılı bir logo bu boyutta bulanıklaşır, bu yüzden güçlü kontrastlı ve biraz boşluklu, sade ve etkili bir işaret kullanın, ardından daha büyük boyutların yüksek çözünürlüklü kaynağınızdan küçültülmesine izin verin.

Tüm favicon ve ikon araçları

Sık sorulan sorular

What sizes does the favicon.ico include?

The generated favicon.ico packs 16, 32, and 48 px — the sizes browsers pick from for tabs, bookmarks, and the address bar. Larger displays use the standalone PNG icons.

Where are my icons generated?

Everything happens in your browser, so the files are created on your own device. How any data associated with the tool is handled is described in our privacy policy.

Do I need the web manifest?

If you want your site to be installable on Android or as a PWA, yes — site.webmanifest points to the 192 and 512 px icons. Otherwise it's harmless to include and future-proofs your setup.

What image format should I upload?

An SVG or a large PNG gives the crispest small icons because there is more detail to downscale from. JPG and WebP also work; just use the highest resolution you have.

Daha fazla görüntü aracı