What size should my source image be?

Square and at least 512 pixels, larger if you have it. Every icon in the set is produced by downscaling, which is clean; upscaling from a small source produces soft results everywhere.

Why does my logo look like a blur in the tab?

Because a favicon renders at sixteen pixels and a detailed logo has nowhere to put its detail. Use a single shape, letter or monogram at high contrast, filling the frame.

Do I still need an .ico file?

Only for genuinely old browsers. Modern ones read PNG icons from link tags, and the multi-resolution .ico is now a compatibility measure rather than a requirement.

Should the background be transparent?

In a browser tab, yes — it adapts to light and dark chrome. On an iOS home screen, no: the icon is composited onto white and a transparent edge shows. A solid background is the safer default.

Favicon Generator

Every icon size a site needs, plus a starter web manifest.

Everything runs inside your browser. Your files never leave your device.

Drop your file here

.jpg, .jpeg, .png, .webp, .gif, .bmp, .avif · they stay on this device

Ask about Favicon Generator

Questions about what this tool does, which option to pick, or what it can and cannot handle.

The question you type here is sent to an AI provider to be answered — your files and whatever you put in the tool above are not, and the assistant cannot see them. Answers are generated and can be wrong. The tool itself is not guessing: it runs deterministic code on your device.

About the Favicon Generator

A favicon is not one file any more. A browser tab wants a small icon, an iOS home screen wants a 180-pixel Apple touch icon, Android wants several sizes described in a web manifest, and Windows tiles want their own. Producing all of them by hand from one source is tedious and easy to leave half-done.

This takes one high-resolution image and generates the set, sized correctly for each destination.

The design constraint that matters is that a favicon is rendered at sixteen pixels square. At that size a logo with a wordmark is an illegible smudge, and detail of any kind disappears entirely. What works is one shape or one letter, high contrast, filling the frame. Take your logo, shrink it to sixteen pixels, and look at it — if you cannot tell what it is, neither can anyone else, and the icon needs to be a simplified mark rather than the full logo.

Supply a square source at 512 pixels or larger. Downscaling produces clean results and upscaling does not, so a small source gives soft icons at every size in the set.

Transparent backgrounds work in a browser tab, where the surrounding chrome varies. They do not work on an iOS home screen, which composites the icon onto white and can leave a visible edge. Supplying a solid background colour avoids that.

The generated files come with the markup to reference them, which is where most incomplete implementations fall down — the files exist on the server and nothing in the page points at them.

How to use it

1Upload a square source image, ideally 512 pixels or larger.
2Check it at sixteen pixels: if the mark is not recognisable there, simplify the artwork before generating.
3Set a background colour if the source is transparent, since iOS composites onto white.
4Download the set and add the generated link tags to the head of every page, not only the home page.

Questions

What size should my source image be?: Square and at least 512 pixels, larger if you have it. Every icon in the set is produced by downscaling, which is clean; upscaling from a small source produces soft results everywhere.
Why does my logo look like a blur in the tab?: Because a favicon renders at sixteen pixels and a detailed logo has nowhere to put its detail. Use a single shape, letter or monogram at high contrast, filling the frame.
Do I still need an .ico file?: Only for genuinely old browsers. Modern ones read PNG icons from link tags, and the multi-resolution .ico is now a compatibility measure rather than a requirement.
Should the background be transparent?: In a browser tab, yes — it adapts to light and dark chrome. On an iOS home screen, no: the icon is composited onto white and a transparent edge shows. A solid background is the safer default.