Favicon Generator
Generate a favicon from any image in all the sizes a website needs (16, 32, 48, 180, 192, 512). Download ready-to-use PNG icons. Free and in-browser.
Drop an image here
or click to choose · favicons generated right in your browser
How to use the Favicon Generator
- 1Drag your source image (PNG, JPG, WebP, or SVG) onto the drop zone, or click to browse. A square graphic of 512x512 or larger gives the sharpest results across every size.
- 2Check the on-screen preview grid, which renders your icon at each target size so you can confirm the 16x16 version is still legible before you commit.
- 3Review the size set the tool will produce: 16, 32, 48, 180, 192, and 512, each labelled with the browser or platform that uses it.
- 4Click Generate. The image is resampled entirely in your browser via the canvas API, producing one ready-to-use PNG per size with no upload.
- 5Download each PNG individually, or grab the whole set at once, and drop the files into your website root directory.
- 6Paste the supplied favicon and apple-touch-icon link tags into your HTML head, and add the 192 and 512 entries to manifest.json so desktop and mobile pick up the correct icon.
About the Favicon Generator
Favicon Generator converts one source image into the six PNG icons a real website deploy needs, and it does the entire job inside your browser tab. When you drop in a PNG, JPG, WebP, or SVG, the tool loads it into memory, paints it onto a set of off-screen HTML canvases, and resamples each copy down to a specific target dimension before exporting it back out as a fresh PNG. Nothing is uploaded. There is no server round-trip and no account, so the image data never leaves the machine you are working on. The six sizes are not arbitrary; each maps to a place a browser or operating system actually looks for an icon. 16x16 and 32x32 are the tab and bookmark icons every desktop browser requests. 48x48 is the size Windows uses for pinned site icons. 180x180 is the apple-touch-icon iOS renders when someone saves your page to an iPhone or iPad home screen. 192x192 and 512x512 are the entries Android Chrome and the PWA web app manifest read for the home-screen icon and splash screen. Because the resizing is local, a logo you have not announced, a client mockup under NDA, or any unreleased artwork stays private, which is the reason a lot of front-end developers and agencies reach for a browser-based tool instead of a random upload site. A practical note on input: feed it a square graphic of at least 512x512 so the largest output stays sharp, since downscaling preserves detail but upscaling only invents blur. Keep the mark bold and the shapes chunky, because thin strokes and small lettering turn to mud at 16 pixels. Transparent PNG input keeps its alpha channel through every size, so tab icons sit cleanly on light or dark browser chrome with no white box. After generating, save the files into your site root, then wire them up with a favicon link, an apple-touch-icon link, and the 192 and 512 entries in manifest.json. It replaces the slow manual loop of opening an editor, exporting six files by hand, and second-guessing which dimension each platform wants.
Frequently asked questions
Do I still need a favicon.ico file, or are these PNGs enough?
For current Chrome, Firefox, Safari, and Edge the PNG set is enough, since every modern browser reads PNG favicons through link tags. A single multi-resolution favicon.ico is only worth adding if you must support Internet Explorer or very old embedded browsers. For almost every site shipping today, the 16 and 32 pixel PNGs cover the tab icon completely.
Why is 180x180 generated as its own file instead of reused from another size?
180x180 is the apple-touch-icon iOS pulls when someone adds your site to an iPhone or iPad home screen. iOS ignores the standard 16 and 32 favicon sizes for that purpose and specifically looks for an apple-touch-icon link at that exact dimension, so it needs its own dedicated file rather than a scaled reuse.
What source image gives the best output quality?
A square image of at least 512x512 pixels. The tool only downscales, and downscaling from a large original keeps every size crisp, whereas starting from something small forces upscaling and produces blurry icons. Keep the artwork bold with thick shapes, because fine detail and thin text stop being readable once the icon is shrunk to 16 pixels.
Does a transparent background survive in the generated icons?
Yes. Every output is a PNG with a preserved alpha channel, so a transparent source background stays transparent at all six sizes. That is what you want for tab icons, which need to sit on light or dark browser chrome without a visible square box behind them.
Is my image sent to a server or stored anywhere?
No. All decoding and resizing runs locally in your browser using off-screen canvas elements, and the image data never leaves your device or reaches any server. There is nothing to store because nothing is transmitted, which is why it is safe for unreleased logos, NDA client work, and artwork you cannot share externally.
Related tools
Browse all free online tools in Image tools and more.
Frequently asked questions
Which sizes do I get?+
Standard favicon sizes: 16×16, 32×32, 48×48, plus Apple touch (180) and PWA icons (192, 512).