How to make a favicon from a PNG
- Tap Choose image above and pick your PNG (a square image with a transparent background works best).
- On the Convert tab, Convert to is already ICO (favicon).
- Tap Convert, then Download result.
- Rename the file to
favicon.icoif needed and put it in your site's root folder.
What the converter makes: tested
The ICO holds one PNG image, scaled so its longer side is at most 256 pixels (the ICO format's maximum), with transparency kept. We checked two files:
| Source PNG | ICO made | Inside |
|---|---|---|
| Square logo, 1024×1024, transparent corners | 5.9 KB | 256×256 PNG, transparency kept |
| Wide banner, 1200×400 | 0.9 KB | 256×85 PNG: proportions kept, not square |
Both files opened correctly as ICO images. The second row is the catch: a non-square image gives a non-square icon, which looks small or squashed in the square space a tab or bookmark gives it. Crop your logo to a square first (on the Dimensions tab, or in any editor).
A single 256×256 image inside the ICO is how current browsers and Windows read favicons: they scale it down to the 16–32 pixels a tab needs. Some older tools prefer ICO files that also contain separate 16×16 and 32×32 images; this converter doesn't make those.
Designing for 16 pixels
A browser tab shows your icon at about 16×16 pixels (32×32 on high-resolution screens). Fine lines and small text disappear at that size. What survives: a bold shape, one or two strong colours, high contrast, and at most one letter. Zoom out on your result until it's tab-sized to check it.
The other icon files a site needs
Modern sites pair favicon.ico with a few PNG icons. Make them from the same square source on the Dimensions tab:
| File | Size | Used for |
|---|---|---|
| favicon.ico | up to 256×256 (this tool) | Browsers that request /favicon.ico |
| icon.svg or a 32×32 PNG | 32×32 | Browser tabs (modern browsers) |
| apple-touch-icon.png | 180×180 | iPhone and iPad home screen |
| icon-192.png and icon-512.png | 192×192 and 512×512 | Android home screen and installable web apps |
Then link them in your page's <head>:
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
Common mistakes
- Renaming a PNG to .ico. Most browsers cope, but other software doesn't. Convert it.
- Using a wide logo with text. It becomes a thin, unreadable strip. Use a square symbol or initial.
- Forgetting the browser cache. Browsers keep old favicons for a long time. Check the new one in a private window.
Frequently asked questions
How do I convert a PNG to a favicon?
Choose the PNG, keep Convert to set to ICO (favicon), tap Convert and download. Put the file in your site's root folder as favicon.ico.
Is a renamed PNG the same as an ICO?
No. An ICO file has its own header and directory. Renaming only changes the name, and some programs reject it.
What size should a favicon be?
This tool embeds your image at up to 256×256; browsers scale it down for tabs. Start from a square image of at least 256×256.
Does the ICO keep transparency?
Yes. The image inside is a PNG with its transparent areas kept. We tested a logo with transparent corners.
My logo isn't square. What happens?
The proportions are kept, so a 1200×400 banner became a 256×85 icon. Crop to a square first for a clean tab icon.
Does it make 16×16 and 32×32 versions inside the ICO?
No, it stores one image up to 256×256, which current browsers and Windows scale down. If an older tool needs several sizes inside one ICO, use a dedicated icon editor.
Is my logo uploaded?
No. The ICO is built in your browser and saved straight to your device.