Skip to content
I Hate Online Tools

Favicon set

One image → ICO + PNG sizes.

This runs in your browser. Nothing is uploaded.

About Favicon set

Turns one square image into a zipped favicon set — PNGs at 16, 32, 48, 180, 192 and 512 pixels plus a favicon.ico — resized entirely in your browser.

Launching a site means producing an irritating pile of icon files at sizes nobody remembers: the browser tab icon, the Apple touch icon, the two Android manifest icons. The generators that do this for you all want your logo uploaded first, which is a strange thing to agree to for a branding asset nobody has seen yet, and a few of them email the result instead of letting you download it.

Here the image you load is drawn into six square canvases at 16, 32, 48, 180, 192 and 512 pixels, and a favicon.ico is assembled around a 32-pixel PNG. All of it lands in favicon-set.zip. Unpack that into your site root and reference the pieces: the .ico for the request browsers make whether you ask them to or not, the 180 as apple-touch-icon, the 192 and 512 in your web app manifest.

Two things to watch for. The source is stretched to fill each square, so a wide wordmark comes back squashed — crop to 1:1 before you start. And a detailed logo is unreadable at 16 pixels regardless of how good the downscale is, so a tab icon needs one shape or a couple of letters rather than your full lockup.

How to use Favicon set

  1. 1Crop your logo to a square if it is not one already.
  2. 2Drop the image in; 512 pixels or larger keeps the big sizes sharp.
  3. 3Click Generate & download to save favicon-set.zip.
  4. 4Unzip into your site root and add the link tags and manifest entries.

What it won't do

  • The .ico holds a single 32-pixel image rather than several embedded sizes.
  • Non-square sources are stretched to fit, not padded.
  • No HTML snippet or manifest JSON is generated for you.

Common questions

What favicon sizes do I actually need?

Four do the real work: 32 pixels for browser tabs, 180 for the Apple touch icon, and 192 and 512 for the Android and PWA manifest. The 16 and 48 pixel files are belt and braces for older browsers and bookmark bars. This set covers all of them, so you can ignore the much longer lists floating around.

Do I still need a favicon.ico file?

Yes, more or less. Browsers, feed readers, link previewers and bookmark tools still request /favicon.ico from your site root whether or not you reference it, and answering with a 404 fills your logs with noise for no reason. It costs a few hundred bytes to have one sitting there.

Why does my favicon look squashed?

Because the image is scaled to fill a square rather than padded to fit inside one. A 600 by 200 wordmark becomes a 512 by 512 icon with everything compressed vertically. Crop or pad your source to a 1:1 ratio first — the crop tool has an aspect lock for exactly this.

Why is my logo unreadable in the browser tab?

A tab icon is about 16 device pixels across, which is room for one glyph or one simple shape. Fine strokes vanish, gradients turn to mud, and text becomes a grey smear. Most brands keep a separate simplified mark for this purpose, and drawing one is a better use of time than fighting the downscale.

Related tools

Why this one doesn't upload your file

There is no server to upload to. This page is a static file, and the work happens in your browser using the same graphics and WebAssembly code that renders every other site you visit. Your file is read from disk into memory, processed, and handed back as a download. Once the page has loaded you can disconnect from the network entirely and it keeps working. The longer explanation

Install the app