Images, SVG & icons
Drop a logo or an existing .ico, check the 16 px tab preview, then download the whole package.
Drop a PNG, JPG, WebP, GIF, SVG or ICO file here, or paste an image from the clipboard.
Images are read and resized in this browser tab; nothing is uploaded.
Choose, drop or paste an image to start.
Choose, drop or paste an image to start.
A new site, a rebrand or a Lighthouse warning usually ends the same way: you have one logo and need half a dozen icon files plus the tags that point to them. This favicon generator produces the current set from that single source, so you are not resizing the same picture six times in an image editor.
It also works in the other direction. Drop the favicon.ico you inherited and it lists every size stored inside, lets you save each one as a PNG, and uses the largest as the source for the missing Apple and Android icons.
It produces the set browsers and phones request today, and nothing they stopped asking for.
A multi-size favicon.ico, 16 and 32 px PNGs, the 180 px Apple touch icon, 192 and 512 px Android icons and site.webmanifest come from a single image. The HTML tags point at your real path, so a site served from /static/ does not need six hand edits.
Drop an existing favicon.ico and the tool lists each embedded image with its real dimensions, bit depth, PNG or BMP encoding and byte size. Save any of them as a PNG, or all of them in one ZIP, which covers the usual ICO to PNG job without a second site.
iOS paints transparent touch icons on black. The apple-touch-icon is therefore always filled with your background colour and left square, because iOS applies its own rounded mask, while the browser icons keep their transparency.
An SVG or a square PNG of at least 512 px gives the sharpest results. A non-square image is centred rather than cropped, and a raster under 512 px gets a warning with its actual size, because the 512 px Android icon would be an upscale.
Generation reruns about 300 ms after each change. Watch the light and dark tab mock-ups and the 4× zoom: thin strokes and small text vanish at 16 px. A little padding helps wide logos; a corner radius only applies to browser and Android icons.
The site path is written into every link tag and every manifest icon src. If the files will live in /assets/icons/, enter that first, then download the ZIP and copy the HTML into the head of your pages.
favicon.ico, favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png, android-chrome-192x192.png, android-chrome-512x512.png and site.webmanifest, plus favicon.svg when the source is an SVG. Every file sits at the ZIP root, ready to copy next to your index page.
The ICO can hold any mix of 16, 24, 32, 48, 64, 128 and 256 px images, stored as PNG data, which every current browser and Windows reads. This makes it a PNG to ICO converter as well as a favicon package tool.
The source is identified by its bytes rather than its extension, and the warnings quote the real width and height. SVG sources are never flagged as too small, since they scale without loss.
The link tags, theme-color meta and manifest icon list are built from the same path and colours, so the HTML never points at a file that is missing from the ZIP.
For today's browsers and phones: a favicon.ico containing 16, 32 and 48 px, 16 and 32 px PNGs, a 180 px apple-touch-icon, and 192 and 512 px icons listed in site.webmanifest. That is exactly what this favicon generator puts in the ZIP.
Yes. Some browsers, feed readers and crawlers still request /favicon.ico at the site root even without a link tag, and the ICO also covers old browsers that ignore PNG icons. Keep it at the root if you can.
Browsers cache favicons aggressively, so hard-reload or open the page in a private window first. Then confirm that the href in each link tag matches where the files really are; set the site path in the tool before copying the HTML so they agree.
The output is always square. A rectangular source is scaled to fit and centred, with transparent space on the short sides and a warning showing its dimensions. For wide logos, a simplified square mark usually reads better at 16 px.
At least 512×512 px for raster images, since that is the largest output. Smaller sources still work but are upscaled. An SVG avoids the problem entirely.
Drop the .ico into the source area. Each embedded image is listed with a PNG button, and the ZIP button saves them all. Legacy BMP images inside the ICO are converted with their transparency mask applied.
Missing a size or a platform?
Drop your logo into the favicon generator, check the 16 px tab on both backgrounds, then take the ZIP and the head tags to your site.
Keep the original logo file for later edits.