Favicon Generator

Upload an image and generate favicons in all sizes — download individually or all at once.

Drop an image or click to upload (512x512 recommended)

Use a square image for best results

Favicon Generator — What It Does

Upload any image and instantly get a complete set of PNG favicons covering every standard size — from the tiny 16x16 browser tab icon to the 512x512 PWA launcher icon. Download sizes individually or grab them all at once. No design software required, no upload size limits, everything runs in your browser.

Standard Favicon Sizes

  • 16×16 — Browser tab, bookmarks bar
  • 32×32 — Taskbar shortcut, Safari Reading List
  • 180×180 — Apple Touch Icon (iPhone/iPad home screen)
  • 192×192 — Android Chrome PWA icon
  • 512×512 — PWA splash screen, high-DPI launcher

HTML Head Tags for Favicons

  • <link rel="icon" href="/favicon.ico"> — Classic fallback
  • <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
  • <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
  • <link rel="manifest" href="/site.webmanifest"> — For PWAs

Tips for Best Results

  • Use a square source image — Non-square images will be cropped or letterboxed at small sizes.
  • Keep it simple — Complex logos lose detail at 16x16; use a simplified mark or initial.
  • Transparent background — PNG with transparency adapts to both light and dark browser chrome.
  • Start at 512x512 or larger — Higher source resolution means crisper downscaled icons.

Frequently Asked Questions

What sizes does a complete favicon set need?
A thorough favicon set includes 16x16 and 32x32 for browser tabs, 48x48 for Windows shortcuts, 180x180 for Apple Touch Icon, 192x192 and 512x512 for Android/PWA manifest icons, and optionally a 270x270 tile for Microsoft Windows. The classic favicon.ico can bundle multiple sizes in one file.
What is the difference between favicon.ico and PNG favicons?
favicon.ico is the traditional format that can embed multiple resolutions (16x16, 32x32, 48x48) in a single file and is universally supported. PNG favicons are modern, sharper at high DPI, and required for Apple Touch Icons and PWA manifests. Best practice is to provide both.
How do I add a favicon to my website?
Place favicon.ico in the root directory — most browsers detect it automatically. For PNGs, add link tags in the <head>: <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> and <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">.
What image format produces the best favicon?
Start with a high-resolution PNG (at least 512x512) with a transparent background. SVG sources also work well since they scale perfectly. Avoid JPEG for favicons — JPEG compression creates artifacts at small sizes and does not support transparency.
Do I need a favicon.webmanifest for PWAs?
Yes. Progressive Web Apps require a web app manifest (manifest.json or manifest.webmanifest) that references 192x192 and 512x512 icon files. Without these, the browser cannot install the PWA on a home screen or show the correct icon in the app launcher.