How to Create a Favicon (.ico) from Any Image — Free, No Upload

The favicon is the small icon that appears in browser tabs, bookmarks, and search results next to your site's name. Despite being tiny, it is one of the first brand signals visitors notice — and it is surprisingly easy to get wrong.

This guide covers everything you need to know about favicons: what the .ico format actually is, what sizes you need, and how to convert any image into a proper favicon file without uploading anything to a server.

---

What Is a Favicon?

A favicon (short for "favourite icon") is typically a 16×16 or 32×32 pixel image that browsers display in the tab bar. The .ico file format is special because it can contain multiple image sizes inside a single file — so browsers can pick the best resolution for their context.

When you see a website's logo in:

• A browser tab
• A bookmarks bar
• Browser history
• Google search results (as a small site icon)
• iOS/Android home screen when added as a shortcut

...that is the favicon at work.

---

ICO Format vs PNG: What Is the Difference?

Many developers use a plain favicon.ico or a favicon.png. Here is the key difference:

| Feature | ICO | PNG | |---|---|---| | Multiple sizes in one file | Yes (16, 32, 48, 256) | No — one size per file | | Browser tab support | Universal | Nearly universal | | Apple home screen (apple-touch-icon) | No | Yes (separate PNG needed) | | Transparency support | Yes | Yes | | Maximum quality | High (lossless PNG inside) | High |

Modern practice: serve both a favicon.ico (containing 16×16 and 32×32) and a apple-touch-icon.png (180×180) to cover all devices.

---

What Sizes Do You Need?

Minimum viable favicon set:

• 16×16 — standard browser tab
• 32×32 — Windows taskbar, Retina displays

Recommended complete set inside a single ICO file:

• 16×16
• 32×32
• 48×48 — Windows desktop shortcut
• 256×256 — Windows high-DPI and Start Menu tiles

Additional files (not ICO format):

• 180×180 PNG — Apple Touch Icon (iOS home screen)
• 192×192 PNG — Android home screen (referenced in manifest.json)
• 512×512 PNG — PWA splash screen

---

How to Convert Any Image to ICO

SwiftConverts's Image Resize tool can convert any PNG, JPG, SVG, or WebP directly to ICO format — entirely in your browser, with no file upload.

Step 1 — Open the Image Resize tool

Go to SwiftConverts Image Resize and upload your image. PNG or SVG gives the best quality since they are lossless.

Step 2 — Set the target dimensions

Common choices:

• 32×32 for a standard favicon
• 256×256 if you want a high-resolution ICO for Windows Start Menu
• 48×48 for Windows taskbar icons

Step 3 — Select ICO as the output format

Click the ICO button in the format selector. A hint will remind you of the common favicon sizes.

Step 4 — Click Resize and download

The file downloads as .ico and is immediately usable in any website or app.

---

Where to Place Your Favicon

Standard HTML websites: Place favicon.ico in your root directory (same folder as index.html). Browsers auto-detect it without any <link> tag.

Next.js (App Router): Drop favicon.ico into the app/ directory. Next.js serves it automatically at /favicon.ico with no configuration needed.

For additional icons, add to app/:

• icon.png (512×512) — used as the general app icon
• apple-icon.png (180×180) — Apple Touch Icon

React / Vite / generic apps: Place in public/ and add to index.html:

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

---

Tips for a Great Favicon

Keep it simple. At 16×16 pixels, complex logos become unrecognisable. Use a single letter, a simplified mark, or a solid shape.

Avoid thin lines. Fine details disappear at small sizes. Opt for bold, high-contrast designs.

Use a transparent background for PNG. ICO supports transparency — a transparent background looks better on both light and dark browser themes.

Test on both dark and light tabs. Some browsers use dark mode tabs; a solid white favicon will become invisible. Use a coloured background or outline.

SVG is the best source. Start from an SVG logo if you have one — it scales perfectly to any dimension without pixelation.

---

Converting GIF and BMP to ICO

The Image Resize tool also accepts GIF and BMP files as input. This is useful if you have:

• An animated GIF logo — the tool captures the first frame and outputs it as a static ICO
• A BMP graphic from older Windows software — upload and export as ICO directly

---

Summary

Creating a favicon is a two-minute task once you know the steps:

1. Start with a clean PNG or SVG version of your logo
2. Use SwiftConverts Image Resize to resize to 32×32 (or 256×256) and export as ICO
3. Drop favicon.ico in your project root or app/ folder
4. Add apple-touch-icon.png (180×180 PNG) for iOS support

No subscriptions, no uploads, no accounts. Your logo stays on your device throughout the entire process.

Create your favicon now — free →