What favicon sizes do I actually need?

Browser tabs use 16 and 32px, Windows shortcuts use 48px, iOS home screens use 180px, and Android/PWA use 192 and 512px. A multi-size favicon.ico holding 16·32·48 plus PNGs at 180, 192 and 512 covers essentially every environment in use today.

Is my image uploaded anywhere?

No. The file is read with FileReader, resized with the Canvas API, and the ICO and ZIP binaries are assembled by JavaScript in the page. There is no network request involved, and everything is discarded when you close the tab.

ICO or PNG — which should I ship?

Both. favicon.ico packs several resolutions into one file and is still auto-discovered at the site root, which makes it a reliable fallback. PNGs are what you point at explicitly for apple-touch-icon and the PWA manifest.

Favicon Generator — Multi-Size ICO & PNG From One Image

33. Preview

Add an image and every size shows up here.

44. Download

The ICO, every PNG size, site.webmanifest and the HTML snippet in one archive.

55. Paste into your HTML

Paste inside <head>

<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="/favicon-48x48.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="192x192" href="/android-chrome-192x192.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="theme-color" content="#4f46e5">

site.webmanifest

{
  "name": "My Site",
  "short_name": "My Site",
  "icons": [
    {
      "src": "/android-chrome-192x192.png",
      "sizes": "192x192",
      "type": "image/png",
      "purpose": "any maskable"
    },
    {
      "src": "/android-chrome-512x512.png",
      "sizes": "512x512",
      "type": "image/png",
      "purpose": "any maskable"
    }
  ],
  "theme_color": "#4f46e5",
  "background_color": "#ffffff",
  "display": "standalone"
}

Tags for sizes you did not generate are left out, so you never ship a 404.

Favicon Generator (ICO · PNG · PWA)

11. Add your image

22. Sizes and style

33. Preview

44. Download

55. Paste into your HTML

Guide · FAQ · more bal.pe.kr tools