PNG to ICO Multi-Size Favicon
Convert a PNG to a multi-size favicon.ico bundling 16, 32, 48, 64, 128, and 256 px versions in one file. Transparency preserved. 100% client-side, no upload.
Drop an image above to begin.
How to use
- 1. Drop your source image onto the upload zone (PNG with transparent background recommended). Use a square image at 512×512 px or larger.
- 2. Choose which sizes to bundle. All six standard sizes (16, 32, 48, 64, 128, 256) are pre-selected — uncheck any you do not need.
- 3. Click Generate .ico to create your favicon file.
- 4. Download the .ico and place it in your website's root directory (
/favicon.ico).
Why bundle multiple sizes into one .ico?
Different contexts need different favicon sizes. A browser tab displays the icon at 16×16 px. A bookmark bar uses 32×32 px. The Windows taskbar and Start menu use 48×48 or larger. High-resolution ("Retina") displays render at 2× density, so a 32×32 favicon actually fills a 64×64 region on-screen. If your .ico only contains one size, the OS scales it — often resulting in a blurry or pixelated icon.
Bundling all sizes in one file means each context gets the pixel-perfect version: 16×16 for tabs, 32×32 for bookmarks, 256×256 for Windows desktop shortcuts. The browser and OS pick the best match automatically. You ship one file instead of six, and the result looks sharp everywhere.
PNG-embedded ICO vs BMP-based ICO
Older .ico files stored each size as a BMP (bitmap) image with a separate AND mask for transparency. Modern .ico files — supported since Windows Vista and all current browsers — embed PNG images directly inside the .ico container. This tool uses the PNG-in-ICO approach, which gives you:
- Full 32-bit RGBA transparency — smooth edges, semi-transparent pixels, no stair-stepping on rounded logo corners.
- Smaller file size — PNG compression outperforms raw BMP for most icons.
- Maximum quality — especially at 256×256 where PNG looks significantly better than the old BMP format.
All modern browsers (Chrome, Firefox, Safari, Edge) and Windows 10/11 support PNG-embedded ICO natively. If you need support for very old browsers (IE8 and below), generate a separate BMP-based ICO with a legacy tool — but for any modern website, PNG-in-ICO is the recommended standard.
常見問題
- What is a multi-size .ico file and why do I need one?
- A .ico file is a container format that bundles multiple image sizes into a single file. Browsers and operating systems automatically pick the best size for each context — 16×16 for browser tab favicons, 32×32 for browser bookmarks and taskbar icons, 48×64 for Windows Start menu tiles, and 256×256 for high-DPI desktop shortcuts. Serving all sizes in one .ico ensures your favicon looks crisp everywhere, rather than being pixelated or blurry from forced scaling.
- Does this tool upload my image to a server?
- No. Every step — loading the image, resizing each size, encoding PNGs, and building the .ico binary — runs entirely inside your browser tab using the Canvas API. Your image never leaves your device and is never sent to any server.
- Which sizes should I include in my favicon.ico?
- For broad compatibility, include at least 16×16, 32×32, and 48×48. Add 256×256 if you want your icon to look crisp when pinned to the Windows desktop or Start menu. If you only need a basic browser favicon, 16×16 and 32×32 are sufficient. This tool defaults to all six sizes (16, 32, 48, 64, 128, 256) — you can uncheck sizes you do not need.
- Does the output .ico preserve transparency?
- Yes. The tool embeds each size as a 32-bit PNG with full alpha-channel transparency. If your source image has a transparent background (e.g., a logo on a transparent PNG), the transparency is preserved in every embedded size. This means the icon will display correctly on any background color in browsers and operating systems.
- Does it work on mobile?
- Yes. The tool works in any modern browser — Chrome, Firefox, Safari 14+, Edge — on iPhone, iPad, Android, Mac, Windows, and Linux. On mobile, tap the upload zone to select an image from your photo library. The .ico file downloads directly to your device.
- What image formats can I use as input?
- Any image format your browser can decode: PNG (recommended — supports transparency), JPEG, WebP, AVIF, GIF, BMP. For best favicon quality, use a PNG source image at 512×512 px or larger with a transparent background. The tool will downsample it cleanly to each selected size.
- How do I add the favicon.ico to my website?
- Place favicon.ico in your website's root directory (e.g., /public/favicon.ico or the document root). Then add <link rel="icon" href="/favicon.ico"> to your HTML <head>. Modern browsers also check for /favicon.ico automatically without any <link> tag. For best results, also add <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> for browsers that prefer PNG.
Last updated: By jarvisbox