Picovert

PNG to ICO — Convert PNG to Favicon (Free, No Install)

By Picovert Team2026-04-305 min read

Every website needs a favicon — the small icon that appears in browser tabs, bookmarks, and the address bar. ICO is the traditional favicon format, required by all browsers for backward compatibility. Converting a PNG logo or image to ICO takes seconds using a free browser-based tool. Here's what you need to know.

How to Convert PNG to ICO Free

  1. Open Picovert's PNG to ICO converter. No account or install required.
  2. Drop your PNG file. Use a square PNG for best results — 512×512 or 256×256 works well.
  3. The converter creates an ICO file containing multiple sizes (16×16, 32×32, 48×48). These are embedded in the single .ico file.
  4. Download the .ico file and save it as favicon.ico in your website's root directory.

What Is an ICO File?

ICO (Icon) is Microsoft's container format for icons. An .ico file can hold multiple images at different resolutions and color depths inside a single file. When a browser displays a favicon, it picks the most appropriate size from the ICO's embedded images. This is why a well-made favicon.ico contains 16×16, 32×32, and sometimes 48×48 versions — the browser uses the right one for each context.

ICO files are also used for Windows desktop icons and application icons. The same format serves both web favicons and system icons.

Recommended PNG Size for Favicon Creation

Start with a square PNG. The source size matters less than squareness — the converter resizes down to the target sizes:

  • 512×512 or 256×256 — Ideal starting size. Large enough to downsample cleanly to 32×32 and 16×16.
  • Minimum 64×64 — Below this, the 16×16 version becomes very blurry.
  • Must be square — Favicons are always square. If your logo is wider than tall, add padding to make it square before converting.

favicon.ico vs. PNG Favicons — Which Should You Use?

Modern browsers support PNG favicons directly, and many developers now use PNG instead of ICO. Both approaches work. Here's when to use each:

  • favicon.ico in the root: Required for backward compatibility. Older browsers and some email clients fetch /favicon.ico automatically, even without a <link> tag. Every site should have a favicon.ico.
  • PNG favicon via link tag: Better quality at larger sizes, and you can specify exact sizes. Used for Apple Touch Icons (180×180) and modern high-DPI screens.

Best practice: have both. A favicon.ico for root-directory automatic fetching, and a PNG favicon declared in your HTML head for modern browsers.

How to Add a Favicon to Your Website

Place favicon.ico in the root of your website, then add this to your HTML<head>:

<link rel="icon" href="/favicon.ico" sizes="any" />
<link rel="icon" href="/favicon.png" type="image/png" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />

The sizes="any" attribute on the ICO link tells the browser this file contains multiple sizes. The PNG fallback handles modern browsers that prefer PNG. The apple-touch-icon is used when someone adds your site to their iPhone home screen — it should be a 180×180 PNG.

Creating a Favicon for Next.js

In Next.js App Router, place favicon.ico directly in src/app/. Next.js automatically serves it as the site favicon. For additional sizes, addicon.png or apple-icon.png to the same directory.

PNG vs. ICO: Key Differences

  • PNG: Single image at a fixed size. Supports full transparency. Smaller file size for individual images.
  • ICO: Container with multiple sizes in one file. Required for/favicon.ico requests. Slightly larger because it bundles multiple sizes.

For a favicon, the ICO format's multi-size capability is useful: it handles 16×16 for browser tabs and 32×32 for pinned taskbar icons from a single file.

Can I Convert a JPG to ICO?

Yes — Picovert also converts JPG to ICO. The process is the same. Note that JPG doesn't support transparency, so if your logo has a transparent background, use a PNG source file to preserve it in the ICO.

Common Favicon Mistakes

  • Non-square source image — A 300×100 logo becomes distorted when forced into a square favicon. Crop or pad to square first.
  • Too complex at small size — A detailed illustration becomes unreadable at 16×16. Use a simplified version of your logo — just the mark, not the full wordmark.
  • Uploading favicon.ico to the wrong location — favicon.ico must be in the root directory, accessible at yourdomain.com/favicon.ico.
  • Forgetting the Apple Touch Icon — iOS uses a separate 180×180 PNG for the home screen bookmark icon. Create this separately from your favicon.