Favicon Generator — Create a Full Icon Pack Free

Turn a logo into favicon.ico plus every PNG size modern browsers expect.

🔒 Runs in your browser — files never uploaded ⚡ No signup 💯 Free

Drop your logo here or tap to browse Square PNG or SVG works best · at least 512×512

Upload a logo and get a complete favicon pack: a multi-resolution favicon.ico, PNGs at every size browsers and phones ask for, a web manifest, and the HTML to paste into your <head>.

Add padding, a background colour or rounded corners, with live previews at each size so you can see how the icon reads at 16 pixels before you ship it.

How to use Favicon Generator

  1. Drop in your logo. A square PNG or SVG of at least 512×512 works best.
  2. Adjust padding, background and corners — the previews update live.
  3. Generate the pack and download the ZIP.
  4. Upload the files to your site root and paste the HTML into your <head>.

What is in the pack

  • favicon.ico — multi-resolution (16, 32, 48px), still the most broadly supported format
  • favicon-16x16.png and favicon-32x32.png — browser tabs and bookmarks
  • apple-touch-icon.png (180px) — iOS home screen
  • android-chrome-192x192.png and 512x512 — Android and PWA installs
  • site.webmanifest — required for a PWA to be installable

Design for 16 pixels, not for 512

This is the mistake nearly everyone makes. A detailed logo that looks superb at full size becomes an unreadable smudge in a browser tab. At 16×16 you have 256 pixels to work with — roughly enough for one bold letterform or one simple shape.

Watch the 16px preview above as you adjust. If you cannot tell what it is at that size, simplify: use a single initial, drop the wordmark, thicken the strokes, and increase contrast. Many strong brands use a completely different mark for their favicon than for their logo, and that is the right instinct.

Where the files go

Put every file in your site's root directory, not in a subfolder — browsers request /favicon.ico from the root automatically, and some ignore the <link> tag entirely.

If your new favicon does not appear

Favicons are cached aggressively — often beyond a normal hard refresh. Try loading yourdomain.com/favicon.ico directly and refreshing that, or open the site in a private window. It is almost always a caching artefact rather than a broken file.

Frequently asked questions

What size should my source image be?

At least 512×512 and square. A PNG with transparency or an SVG gives the best result. Smaller sources will look soft when scaled up to the 512px PWA icon.

Where do the files go?

All of them in your site's root directory, not a subfolder. Browsers request /favicon.ico from the root automatically and some ignore the link tag entirely.

My new favicon is not showing. Why?

Favicons cache aggressively, often surviving a hard refresh. Load yourdomain.com/favicon.ico directly and refresh that page, or check in a private window. It is nearly always caching rather than a broken file.

Do I still need favicon.ico?

Yes. Despite PNG support being universal, browsers still request /favicon.ico from the root by default, and some contexts only use it. The pack includes a multi-resolution one.

Why does my logo look bad at 16px?

Because 16×16 gives you 256 pixels — enough for one bold shape or letter, not a detailed logo. Watch the 16px preview and simplify: drop the wordmark, thicken strokes, raise contrast. Many strong brands use a different mark entirely for their favicon.