My tools

Favicon generator

Drop a logo, see it at every real size, and leave with favicon.ico, the PNG set and the HTML.

PNG / JPEG / WebP / GIF / SVG — or drop one on this card

Add an image (or switch to letters) and every size appears here — there is no “generate” button.favicon.ico 16/32/48 · PNG 16 · 32 · 48 · 180 · 192 · 512 · site.webmanifest · HTML

How to use it

  1. Pick an image, or drag one onto the card: every size appears at once. There is no generate button — what you see is what downloads.
  2. No logo yet? Switch to “Letter / emoji” and type one or two characters. The colour picker sets the background, and the letter turns black or white by contrast.
  3. Download the bundle, unzip it into your site root, paste the copied <link> tags into <head>, then reload your site — the tab icon should be there.

Example

Source

logo.png · 512×512, shape “Rounded”

Bundle (9 files)

favicon.ico (16/32/48)
favicon-16x16.png
favicon-32x32.png
favicon-48x48.png
apple-touch-icon.png (180)
android-chrome-192x192.png
android-chrome-512x512.png
site.webmanifest
snippet.html

The same source with the same options gives byte-identical PNGs and a byte-identical ZIP (the archive timestamp is fixed at 1980-01-01), so the bundle can be committed and diffed. Changing the shape only clips the corners; it never redraws the artwork.

Scope, limits and common questions

  • No SVG export. An SVG that survives 16 px needs hand-simplified paths; wrapping the bitmap in SVG or drawing system-font text would only look like vector art. Keep your own .svg next to this PNG set if you want one.
  • Images are fitted, never cropped. A non-square logo keeps transparent margins — crop or compose it first (the image resizer / converter here can help).
  • Transparent icons get a background from the platform: iOS paints one behind apple-touch-icon, and some Android launchers do too. For a background you control, use “Letter / emoji”, or add the background to the source image.
  • site.webmanifest lists icons only — no name or short_name. That is your site name, which this tool cannot know; add both keys after unzipping (name is optional and browsers fall back to the page title).
  • favicon.ico carries 16, 32 and 48 px, not 64 or 128. That covers modern browsers and Windows; add more sizes as PNG if you need them.
  • Animated GIF / WebP: only the first frame is used. Favicons do not animate anyway.
  • Letter icons are drawn with your system font, so they differ on macOS, Windows, Linux and phones. The PNG freezes what your device shows — which is also why there is no font picker.
  • No URL fetching and no live check: this tool cannot take a website address, and it cannot verify a deployed favicon. After deploying, open your site and look at the tab.
  • Limits: 20 MB per file and 8000 px per side. Sources under 180 px are upscaled for the large icons and may look soft.
  • No cropping, no background removal, no batches and no history: a reload starts from an empty state (nothing is stored, nothing goes into the URL).

What people usually need next, once the icons are in place.

Image resizer

Image converter