Favicon Generator
Turn a single image into a favicon — the little icon that sits in the browser tab — at the sizes browsers actually ask for.
More than one size
A favicon isn't one file. A browser tab wants a small one, a bookmark wants something sharper, and a phone home-screen shortcut wants a larger icon again. This tool takes your source image and produces the set, so you're not exporting the same picture five times by hand at five different sizes.
The best source is simple and square: a bold letter, a mark, a logo with plenty of contrast. Fine detail vanishes at 16 pixels, so anything intricate just turns to mush in the tab.
Getting it onto your site
Once you've generated the icon, it goes in your site's root and gets referenced from the page head. A square image with a transparent or solid background works best; busy photographs make poor favicons because there's simply no room for them to read at icon size. Test it in a real tab afterwards — that tiny preview tells you instantly whether it holds up.
How to generate a favicon
- Add a square image or logo.
- It is rendered at every size browsers and devices ask for.
- Download the icons and drop them into your site.
Designing for sixteen pixels
A favicon is displayed at around 16-32 pixels in a browser tab, which is smaller than most people design for. Detailed logos turn to mush at that size, so the icons that work are bold and simple: a single letter, a strong shape, high contrast against both light and dark tab backgrounds.
Start from a square image at least 512 pixels across. Everything else is scaled down from it, and a small or non-square source shows its limitations immediately at the larger sizes phones use for home-screen shortcuts.
Favicon Generator FAQ
What size should a favicon be?
Supply a square source of at least 512 pixels; the browser sizes (16, 32, 180, 192 and up) are generated from it.
Why does my logo look unreadable as a favicon?
Fine detail disappears at 16 pixels. Simplify to a single letter or bold shape.
Where do the files go?
In your site's root folder, referenced from the
of your pages.What size should my source image be?
Start with a square image at least 256×256, ideally larger and simple in design, so it stays crisp when scaled down to tab size.
Why does a favicon need multiple sizes?
Different places use different sizes — the tab, bookmarks, and phone shortcuts each want their own — so a set covers them all cleanly.
Does my image get uploaded?
No. The icon is generated in your browser from the image you choose.