jarvisbox

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.

100% client-side · no upload. Your image is resized to each selected size using the Canvas API and bundled into a single .ico file — entirely in your browser. Files never leave your device.
Sizes to include in .ico

16×16 and 32×32 are required for browser favicons. 256×256 is used by Windows desktop icons.

Features: 6 sizes in 1 file PNG embedded (32-bit color) Transparency preserved Works in all browsers

Drop an image above to begin.

How to use

  1. 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. 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. 3. Click Generate .ico to create your favicon file.
  4. 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:

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.

Frequently Asked Questions

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:

Report a problem with this tool