Skip to content

Favicon Generator — All Sizes + ICO

Upload one logo and this favicon generator renders every file a modern site needs — 16, 32, 180, 192 and 512px PNGs plus a genuine multi-image favicon.ico (16+32+48 in one file, assembled byte-by-byte in your browser), a site.webmanifest, and the exact snippet for your <head>. Each file downloads individually with a plain-English note on where it goes. Your logo never leaves your device.

  • Nothing you type leaves this page
  • Works offline once loaded
  • Free forever, no signup

{{ fileName }} — {{ sourceInfo }}

{{ warning }}

Background color
{{ bgColor }}
Theme color
{{ themeColor }}

How to use this tool

  1. Drop in a square logo

    An SVG or a PNG of 512px+ gives the crispest results. Transparent backgrounds are fine — the iOS icon gets an opaque fill automatically.

  2. Tune background, padding and manifest

    Add a background color or padding if your mark needs breathing room at 16px, and set the site name and theme color for the manifest.

  3. Download the files and paste the snippet

    Download each file into your site's root folder — the table says what every file does — then paste the six-line snippet into your HTML <head>.

Questions people ask

What size should a favicon be?

Several sizes, not one: 16×16 and 32×32 PNGs for browser tabs, a favicon.ico containing 16/32/48 for legacy consumers, 180×180 for iOS home screens, and 192/512px for Android and PWAs. This tool renders all of them from one image, downscaled individually so each stays sharp.

Do I still need a favicon.ico in 2026?

Yes — it's the universal fallback. Browsers, crawlers, RSS readers and corporate proxies still request /favicon.ico by convention, snippet or not. The one generated here is a real multi-image ICO: three PNG frames wrapped in a proper ICONDIR header, not a renamed PNG.

What is an apple-touch-icon and why is it opaque?

The 180×180 icon iOS shows when someone adds your site to their home screen. iOS composites transparency onto black, which usually looks broken — so this tool always fills its background (white, or your chosen color), while the other sizes keep transparency.

Where do the files go, exactly?

All of them in your site's root folder — the same directory as your homepage's index.html — so paths like /favicon.ico and /apple-touch-icon.png resolve. The snippet references them at the root; if you must nest them, update the paths in both the snippet and site.webmanifest.

Why is my favicon not updating?

Browsers cache favicons aggressively — sometimes for days. Force-reload (Ctrl+Shift+R), or bust the cache by adding ?v=2 to the href in your snippet. Also confirm the files really are at the referenced paths: a 404 favicon fails silently.

Why individual downloads instead of a zip?

Deliberate: everything here runs in your browser with zero third-party libraries, including the ICO encoder. Six small files with a where-it-goes note next to each is also harder to deploy wrong than an unzipped-and-forgotten archive.

Is my logo uploaded anywhere?

No. Decoding, resizing, ICO assembly and manifest generation all happen on your device. The files exist only where you save them.

We build custom web tools like this one

Dynamb Technologies has been designing and running business software for 25+ years. If you need something built around how your business actually works, tell us about it.