filetity

Favicon size: the answer is six numbers, not one

The question assumes a favicon is one image. It is not. A .ico is a container holding several sizes at once, and the thing displaying it picks the one it wants. So the useful answer is not a number, it is which sizes to put in the file and what each of them is actually for.

The six, and what uses them

SizeWhere it showsBytes in our test file
16The browser tab. The one that decides whether your mark reads.431
32Bookmarks bar, and the tab on a retina screen.785
48Windows, in file listings and site shortcuts.1,204
64A retina 32, and some desktop views.1,616
128Desktop shortcuts, larger tiles.3,492
256High density displays and large icon views.7,842

That is one file of 15,472 bytes, measured on 2026-09-12 from a simple two colour mark. Half of it is the 256. If that bothers you, leave the 256 out; nothing breaks, the system just scales the 128 when it needs something bigger.

16 is the one that matters

Almost every time anyone sees your favicon, they see it 16 pixels wide, next to a truncated page title, in a row of twenty other tabs. That is 256 pixels of canvas in total. A logo with a wordmark, a gradient or any detail at all becomes a smudge, and the smudge is what people actually recognise you by.

The practical test: shrink your mark to 16 pixels and look at it from arm's length. If you cannot tell it from a grey square, the problem is the artwork, not the export settings. Most good favicons are one letter, one shape, or two flat colours, and that is not a stylistic preference, it is what survives.

Why an upscaled size is worse than a missing one

If you hand a converter a 48 pixel PNG and it gives you back a file containing a 256, it invented those pixels. The result is soft and obviously wrong precisely where a large icon gets used, on a desktop shortcut where there is room to see it.

Leaving the size out is better. The system scales down from the largest real size it has, which it is good at, instead of displaying something that was scaled up, which nothing is good at. Our PNG to ICO page drops sizes larger than the source for that reason, and prints which sizes it wrote so you can see what you got.

An SVG is the exception, and the reason it is worth designing icons in one. It is instructions rather than pixels, so every size can be drawn at its own size, and the 16 gets its strokes snapped for 16 rather than resampled down from something bigger.

Do you still need favicon.ico if you have an SVG?

Yes, and for one blunt reason: a request for /favicon.ico at the root of your site happens without anything reading your HTML first. Current browsers will happily use an SVG you declare in a <link> tag, and that is worth doing. Behind it sits a long tail that only understands ICO: Windows shortcuts, older readers, feed clients, crawlers, and whatever is embedded in somebody's intranet. Ship both. The ICO costs fifteen kilobytes.

The other numbers people mean by this question

180 pixels for apple-touch-icon, a separate PNG, used when somebody adds your site to an iOS home screen. Square, no transparency, because iOS puts it on a solid tile and rounds the corners itself. 192 and 512 for a web app manifest, if you have one. Neither belongs in the ICO; they are their own files.

Make one

All of these write every size into one file, in your browser, with nothing uploaded. Start from an SVG if you have one.

filetity is built by Adarsh Mishra. The byte counts above are from one ICO written by our own converter on 2026-09-12 and will differ with your artwork; the sizes and what uses them will not. Corrections welcome: support@filetity.com.