Question 1

How do I convert PNG to ICO for a favicon?

Accepted Answer

Drop a PNG file (ideally 256x256 or larger, and square) onto the upload area. The tool reads the image with the browser's Canvas API, resamples it to 16x16, 32x32, and 48x48 using high-quality bilinear filtering, then writes those three bitmaps into a single ICO container with the correct ICONDIR and ICONDIRENTRY headers. You download the file as favicon.ico. The whole pipeline runs locally — your logo never leaves the browser. Other 'png to ico online' tools typically upload your image to their server and process it remotely; this one doesn't, which matters more than people think when you're working with unreleased branding assets.

Question 2

What sizes are included in the ICO file?

Accepted Answer

The output ICO contains three bitmaps at 16x16, 32x32, and 48x48 pixels. These three sizes cover the vast majority of real-world favicon use: 16x16 for the browser tab and bookmark bar, 32x32 for high-DPI tabs and Windows taskbar shortcuts, and 48x48 for the Windows desktop shortcut and some legacy contexts. Modern browsers prefer larger PNG icons declared via <link rel="icon" sizes="..."> tags, but having a multi-size .ico file at /favicon.ico is still the universally-supported fallback that every browser since Internet Explorer 5 understands. Larger sizes like 64x64 or 256x256 inside an ICO are rarely needed in 2026.

Question 3

What kind of source image works best?

Accepted Answer

A square PNG with a transparent background, at least 256x256 pixels, simplified for legibility at 16 pixels. The tool will accept any aspect ratio and resize, but non-square inputs get distorted. Photos and complex illustrations also work poorly because at 16x16 they become unrecognizable mush — favicons need to read clearly at thumbnail size, which means bold shapes, high contrast, and minimal detail. Look at how Google, GitHub, and Stripe favicons are designed: a single bold letter or simple geometric mark, never a photo. If your logo has fine detail or thin lines, consider drawing a simplified favicon variant rather than auto-shrinking the full logo.

Question 4

How do I add the favicon to my website?

Accepted Answer

Two steps. First, place the downloaded file at your site's web root so it's served from /favicon.ico — this is the implicit URL every browser checks first. Second, add an explicit link tag in your HTML for clarity and to override caching: . For Next.js, place it at app/favicon.ico (App Router) or public/favicon.ico (Pages Router). For static sites, drop it in the build output directory. After deploying, force-refresh in an incognito window because browsers cache favicons aggressively — sometimes hours or days. To force a refresh on existing users, change the URL: href="/favicon.ico?v=2".

Question 5

Why ICO instead of PNG or SVG for favicons?

Accepted Answer

The .ico format predates the modern web and remains the universally-supported favicon container, especially for legacy browsers, RSS readers, and Windows shortcuts. Modern browsers also accept PNG and SVG via <link rel="icon" type="image/png" href="/icon-32.png" sizes="32x32">, and for new sites that's actually the recommended approach because PNG/SVG are smaller and rendering is sharper. But you still want /favicon.ico as a fallback because some platforms (Microsoft Office, certain RSS readers, older browsers, embedded webviews) only check that path. Best practice in 2026: ship both — PNG/SVG for modern browsers via link tags, plus an /favicon.ico for everything else. This tool produces the .ico half.

PNG to ICO

How do I use PNG to ICO?

What is PNG to ICO?

Frequently asked questions about PNG to ICO

Related tools