Favicon Generator (ICO + PNG)
Turn any image into a multi-size favicon.ico plus PNG icons.
Icons are built on your device, not on a serverMake a favicon.ico from a PNG, JPG or SVG
or drag & drop it here, or paste it from your clipboard (Ctrl+V)
PNG · JPG · WebP · GIF · SVG
Actual-size preview
Choose an image and your icons show up here, each at the size it will really be.
Each icon is shown at the exact pixel size it will be. If the 16 px one is unreadable, simplify the artwork — drop the text and the hairline detail.
How it works
Everything runs in your browser — the image is never uploaded and there is no sign-up.
SVGs are rasterised at 512 px before being scaled down. Fonts and images the SVG pulls in by URL will not appear.
About this favicon generator
Drop in a PNG, JPG, WebP or SVG and get back a single favicon.ico holding several square sizes at once — 16, 32, 48, 64, 128 and 256 pixels — plus each size as a standalone PNG if you would rather link them separately. The image is drawn to a canvas at each size, encoded as PNG, and the ICO container is assembled byte by byte in the page: a six-byte directory header, one sixteen-byte entry per size, then the image data. That is the whole format, which is why producing a real multi-size icon needs no upload at all.
It is built for the moment a site goes live and the browser tab is still showing a blank sheet of paper. Bring a square logo, pick your sizes, download the .ico, drop it at the root of your site, and paste in the link tags — the exact modern set is spelled out further down this page, along with what each size is genuinely used for. The same file covers a Windows shortcut, a desktop app installer, or an avatar that wants a square PNG.
The hard part of a favicon is not the file format, it is that 16 by 16 pixels is 256 pixels in total. A full logo with a wordmark turns to grey mush at that size. What survives is one letter, one glyph or one strong shape, in a colour that holds up against both a light and a dark browser theme. Crop your logo down to its mark before generating anything, leave a little air at the edges so it does not look cramped inside a rounded mask, then judge the 16-pixel preview rather than the 256-pixel one — the small one is what people actually see.
Two honest limits. This tool resizes and re-encodes; it does not optimise. Canvas always writes 8-bit RGBA PNG with no palette, so an icon editor that quantises colours will produce a smaller file than this does. In a favicon that is a few KB and rarely matters, but it is true and worth saying. Second, the output is raster: an SVG you feed in is rasterised at each size, and the .ico stores pixels, not vectors. For an icon that stays sharp at any density, serve the .svg itself with rel="icon" sizes="any" and keep the .ico as the fallback.
Everything runs in this tab. The image is decoded, resized and encoded locally, and the ICO bytes are assembled by the page’s own JavaScript — nothing is uploaded, queued behind other people’s jobs, or parked on a server for a retention window. Favicons end up public by definition, so this is less a privacy pitch than a practical one: no account, no watermark, no daily limit, no waiting, and a client’s unreleased mark stays on your machine while you are still iterating. One useful side effect: re-encoding through a canvas drops the source file’s metadata, so EXIF from the original photo never reaches the icon.
Which favicon sizes and link tags you actually need in 2026
Favicon advice ages badly, and a lot of what is still online was written for browsers that no longer ship. The list below is built only from what the primary sources say today: the HTML Standard for how browsers pick an icon, Apple for the Home Screen icon, Google Search Central for the icon beside your search result, web.dev for the install prompt, and Microsoft for Windows. Four files is the honest answer for a website, and two of them are optional.
| What to ship | What it is for | What the source says |
|---|---|---|
| favicon.ico with 16 and 32 inside | Browser tabs, bookmarks, and the automatic fallback | The HTML Standard: with no icon link in the document, user agents may resolve and fetch /favicon.ico against the page URL and use it as if it had been declared. |
| icon.svg | One file that stays sharp at any display density | sizes="any" represents a scalable icon such as an SVG. Support is wide but recent in Safari — caniuse records SVG favicons from Safari 26.0 and iOS Safari 26.0, and requires the file be served as image/svg+xml. |
| apple-touch-icon.png at 180×180 | The Home Screen icon when someone saves your site on iPhone or iPad | Apple’s own example declares 152, 167 and 180 plus a default, and the docs state that with no exact match it uses the smallest icon larger than the requested size — so one 180 covers the set. |
| 192×192 and 512×512 PNG in the manifest | Chrome’s install prompt and the installed app icon | web.dev’s install criteria: the manifest “must include a 192px and a 512px icon”. Add a copy with "purpose": "maskable" if you want control over how Android crops it. |
| Any square icon above 48×48 | The icon beside your result in Google Search | Google: the favicon must be square and at least 8×8 px, and they recommend larger than 48×48 px. Supported rel values are icon, shortcut icon, apple-touch-icon and apple-touch-icon-precomposed. |
| 16, 32, 48 and 256 in one .ico | A Windows shortcut, folder or desktop-app icon | Microsoft: “The full set includes 16x16, 32x32, 48x48, and 256x256 (code scales between 32 and 256). The .ico file format is required.” |
<link rel="icon" href="/favicon.ico" sizes="16x16 32x32">
<link rel="icon" href="/icon.svg" type="image/svg+xml" sizes="any">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/manifest.webmanifest">One rule in that snippet is easy to get wrong. The spec says the sizes keywords “must not represent icon sizes that are not actually available in the linked resource”, and that they are raw device pixels rather than CSS pixels — a slot 16 CSS pixels wide on a 2x display wants a 32 pixel image. So declare exactly what your .ico contains and no more, and generate a 32 even though the tab looks 16 wide. The registered MIME type for ICO is image/vnd.microsoft.icon, which is what the HTML Standard’s own example uses; type="image/x-icon" is a legacy spelling browsers still accept. Adding rel="shortcut icon" is unnecessary for browsers, though Google lists it as a supported value for search results.
Why does a 1990s Microsoft format survive at all? Two reasons, neither of them nostalgia. It is a container: Microsoft’s ICONDIR is a six-byte header followed by one ICONDIRENTRY per image, so a single file carries 16, 32, 48 and 256 pixel versions and lets the consumer pick — MDN notes that ICO and Apple’s ICNS are the two formats able to store multiple sizes, and that “ICO has better browser support”. And it is the filename in the spec’s root fallback, which is why /favicon.ico keeps working on sites whose markup says nothing about icons. Its one hard ceiling comes from that same structure: bWidth and bHeight in a directory entry are a single byte each, so 256×256 is the largest image an .ico can describe — which is exactly why manifest icons at 512 have to be separate PNG files.
Three pieces of advice you can now drop. The long apple-touch-icon ladder that older generators still emit — half a dozen files climbing from 57 to 144 pixels — predates Apple’s current documentation, and Apple’s own nearest-larger selection rule makes a single 180 sufficient. The msapplication-TileImage meta tags and browserconfig.xml existed for pinned tiles in Internet Explorer and legacy Edge; Microsoft’s lifecycle documentation records that the IE 11 desktop application went out of support on 15 June 2022 and has been permanently disabled on some versions of Windows 10, and that Edge Legacy ended support on 9 March 2021. And the widely repeated rule that a favicon must be a multiple of 48 pixels is not in Google’s current documentation, which asks only for a square image of at least 8×8 and recommends going above 48×48.
Use your .ico as a Windows folder or shortcut icon
File Explorer will not take a PNG or JPG when you change a folder's icon: the Change Icon dialog only reads icon files (.ico) and the executables or DLLs that carry icons inside them. That is why a good share of "convert image to ico" searches really end up here. Download the .ico with 16, 32, 48 and 256 inside — the set Microsoft documents for application and Explorer icons — then apply it like this:
- Save the .ico somewhere it can stay put — your Documents folder, or an "Icons" folder of your own. Windows records the path to the file rather than copying it, so if you later move or delete the .ico the icon reverts to the default.
- Right-click the folder and choose Properties.
- Open the Customize tab and click Change Icon.
- Click Browse, select your .ico file, and click OK twice. If the desktop does not refresh, press F5.
- A shortcut is slightly different: Properties > Shortcut tab > Change Icon, then Browse to the same .ico.
Reference tables
FAQ
What favicon sizes do I actually need?
Far fewer than most guides claim. A favicon.ico containing 16 and 32 pixel versions covers browser tabs and bookmarks; add 48 and 256 if the same file will also be a Windows icon, which is the set Microsoft documents for application and Explorer icons. One 180×180 apple-touch-icon covers iOS, because Apple picks the smallest icon larger than the size it wants. If you ship a web app manifest, Chrome’s install criteria additionally require a 192 px and a 512 px icon — both larger than the 256 px ceiling of the ICO container, so those are separate PNG files.
Should my favicon be .ico or .png?
Both work: PNG favicons are supported by every browser still in use, including IE 11. ICO earns its place for two other reasons — it is a container, so one file can hold several sizes and let the browser choose, and the HTML Standard says that when a page declares no icon link at all, a browser may fetch /favicon.ico from the site root on its own. A good 2026 default is an SVG for modern browsers plus a multi-size .ico as the fallback, since caniuse records SVG favicon support in Safari only from version 26.0.
Why is my old favicon still showing?
Because the browser is under no obligation to refresh it. The HTML Standard states outright that user agents are not required to update icons when the list of icons changes, only encouraged to. Force it with a hard reload, a private window, or a version query string such as /favicon.ico?v=2. In Google Search the wait is longer and out of your hands: Google says crawling the favicon “can take anywhere from several days to several weeks”, and you can request indexing of your home page to nudge it.