How to create a favicon from an image, free and in your browser
To make a favicon, click the upload area or drag your logo onto it (PNG, JPG, WebP, GIF or SVG) and click Generate Favicons. You get ten PNG icons from 16×16 to 512×512 pixels, a favicon.ico holding the 16, 32 and 48 pixel sizes, a site.webmanifest and the HTML tags for your page head. Click Download All as ZIP, upload the files to your site root, and paste the code from the HTML Code panel with Copy Code.
It runs in your browser; nothing is uploaded (you can check the Network tab in DevTools). The image is read and resized with the browser canvas on your device, and the ZIP is built there too. There is no account and nothing to install.
Favicons are square, and your image is never stretched: a non-square image is padded to a square by default, or cropped from the centre if you choose. A square source of at least 512×512 pixels, or an SVG, gives the sharpest result. The tool makes icons only; it does not edit or design a logo.
The generated tags go in the head of your pages, next to the meta tag generator output and the Open Graph generator tags for social previews. For a single image, the favicon from image tool covers the same ground.
Table of Use: the files you get and where each is used
| File | Size | Used for |
|---|---|---|
favicon.ico | 16, 32 and 48 px in one file | The classic root icon that browsers request by default |
favicon-16x16.png and favicon-32x32.png | 16 and 32 px | Browser tabs, small and large |
favicon-48x48.png | 48 px | Windows taskbar and Google Search |
favicon-64x64.png, -128x128 and -256x256 | 64, 128 and 256 px | High-DPI tabs, desktop shortcuts and high-resolution displays; offered for download, not linked in the snippet |
apple-touch-icon.png | 180 px | iOS home screen, always on a solid background |
android-chrome-192x192.png and -512x512.png | 192 and 512 px | Android home screen and splash screen, listed in the manifest |
mstile-150x150.png | 150 px | Windows tile for legacy Edge and Internet Explorer |
site.webmanifest | Text file | App name, the two Android icons, theme and background colour, and standalone display |
favicon-snippet.html | Text file | The same tags as the HTML Code panel, ready to paste |
favicon.svg | Your original | Only when the source is an SVG; linked with type="image/svg+xml" |
The ZIP holds 13 files, or 14 with an SVG source, plus one PNG for each extra size you add. To change the format of a single picture first, use the PNG to ICO converter or the ICO to PNG converter.
Features
- Five input formats. PNG, JPG, WebP, GIF and SVG. A GIF is flattened to its first frame, and transparency is kept. Change Image swaps the source.
- Sharp small sizes. Large images are halved step by step with high-quality smoothing before the final size, so a 2,000 pixel logo does not turn jagged at 16 pixels.
- Pad or crop. Fit whole image (pad to square) or Crop to square (centre), with a note under the image when it is not square or is smaller than 512 pixels.
- Background colour. Fill transparent areas with a colour of your choice. It is also used for the manifest colours and the Windows tile colour.
- Custom sizes. Add a size from 8 to 1024 pixels. Each becomes a
favicon-NxN.pngwith its own link tag, except 16, 32, 48, 64, 128 and 256, which the set already has. - Manifest with your name. The App name for site.webmanifest box fills the name fields. Leave it empty and fill in the manifest by hand.
- Previews on a checkerboard. Every icon is shown with its file name and a Download button, so transparency is easy to see.
- Automatic rebuild. After the first Generate Favicons, changing a setting rebuilds the whole set.
- Several images to one ZIP. The Several images → one ZIP button builds favicons-batch.zip with one folder per image, using your current settings, and reports how many converted.
Pick the brand colour with the color picker, prepare the logo with the image cropper or the background remover, then bring it here.
How to use the favicon generator
- Click the area labelled Click to upload or drag and drop, or drop your image onto it.
- Under Non-square images, choose Fit whole image (pad to square) or Crop to square (centre).
- Under Background, tick Fill transparent areas with and pick a colour if you want one behind the icon.
- Under Extras, type the App name for site.webmanifest, and use Add for an extra size from 8 to 1024 pixels.
- Click Generate Favicons and check the previews under Generated Favicons.
- Click Download All as ZIP, or download single files and the favicon.ico (16, 32, 48) button.
- Upload the files to your site root, click Copy Code under HTML Code and paste it into the head of your pages.
Who can use it
- Web developers who need the full icon set and the matching tags without hand-writing them, and who may also generate an robots.txt and sitemap for the same launch.
- Site owners and bloggers adding an icon to a hosted or self-managed site from a logo they already have.
- Designers checking how a mark looks at 16 pixels before handing it over.
- App and PWA builders who need the 192 and 512 pixel icons and a starter site.webmanifest.
- Agencies processing a batch of client logos into one ZIP.
FAQs
How do I create a favicon from my logo?
Click the upload area or drop an image on it (PNG, JPG, WebP, GIF or SVG), then click Generate Favicons. Click Download All as ZIP, unzip it into your website’s root folder, and paste the code from the HTML Code panel into the head of your pages. Open the site in a private window to check it, because browsers cache favicons hard.
What size should a favicon be?
Browsers use 16×16 and 32×32 pixel icons in tabs, and the tool also writes 48×48 for the Windows taskbar and Google Search. As of October 2026, Google Search Central says a favicon must be square, at least 8×8 pixels, and recommends larger than 48×48. Start from a square image of 512×512 pixels or more, or an SVG, so every size stays sharp.
Does it make a favicon.ico file?
Yes. favicon.ico contains 16×16, 32×32 and 48×48 versions in the classic 32-bit format with transparency, which browsers and Windows read. Many browsers and crawlers also ask for /favicon.ico by default when a page names no icon, so it is worth keeping in your site root. Download it on its own with the favicon.ico (16, 32, 48) button.
Can I use an SVG logo as a favicon?
Yes. The SVG is drawn at 1024 pixels on its long side, so every PNG size is sharp, and the original is added to the ZIP as favicon.svg with a matching link tag. As of October 2026, Can I use lists SVG favicon support from Chrome and Edge 80, Firefox 41 and Safari 26. Keep the PNG and ICO files as a fallback for older browsers and for Google Search.
Why does the Apple touch icon have a solid background?
The tool notes that iOS shows transparent parts of a home screen icon as black, so the 180×180 apple-touch-icon.png is always filled: with your Background colour if Fill transparent areas with is ticked, otherwise white. Every other icon keeps its transparency unless you tick that box, and the same colour becomes the theme and background colour in site.webmanifest.
What happens if my image is not square?
Your image is never stretched. By default Fit whole image (pad to square) keeps all of it, centred on a transparent square or on your background colour. Choose Crop to square (centre) to cut equal amounts from the longer sides instead. The panel under your image tells you which will happen, and warns you when a source under 512 pixels means the large icons are enlarged.
Why is my new favicon not showing in the browser or in Google?
Browsers cache favicons aggressively, so try a private window or clear the site’s cache first. Check that the files sit in the root folder and match the paths in your link tags. As of October 2026, Google’s favicon guidelines say recrawling can take days to weeks and list ICO and PNG among the formats but not SVG, so keep those files.
Are my images uploaded anywhere?
It runs in your browser; nothing is uploaded (you can check the Network tab in DevTools). Your image is read, resized on a canvas and packed into the ZIP on your device. The only extra request you may see is this site’s own zip script, loaded the first time you build a ZIP, and no image travels with it. There is no account and nothing is stored.