Generator

Make a favicon, without uploading anything

Set a couple of letters in one of hundreds of typefaces, pick an emoji, choose from about 116,000 icons across forty libraries, or drop in an image. You get favicon.ico, favicon.svg, every PNG size from 16 to 512, the web manifest and the markup to paste — as one zip.

Everything runs in this tab. Your image is never uploaded.

One or two read best at 16 px.

Typeface

From Google Fonts. Within each group the ones that hold up best at 16 px come first — measured, not guessed.

Shape

Preview

In the zip

  • favicon.ico16, 32, 48 and 256 in one file. Windows reads the 256 for large icons.
  • favicon.svgEmoji and icon packs — both are vector all the way through, so the SVG here is real rather than a bitmap renamed.
  • PNG at every size, 16 to 51216, 32, 48, 64, 96, 128, 192, 256 and 512 — each declared in the snippet, so whatever asks for a size finds it.
  • apple-touch-icon180, square and opaque. iOS applies its own rounding.
  • android-chrome and maskable192 and 512 are the two the manifest names; the maskable one is padded for the circular crop.
What is deliberately left out
  • Windows tiles and browserconfig.xml — Windows 8 lost support in January 2023.
  • Safari pinned-tab mask-icon — Safari dropped the feature; apple.com no longer uses it.
  • apple-touch-icon 57 to 152 — iOS downscales the 180 on its own.

These are formats nothing reads any more, not sizes. Every size from 16 to 512 is in the zip.

Paste into <head>

Installing it

Four steps, and the second is the one people miss.

  1. 1Download the zipIt is generated in this tab — nothing is uploaded and nothing is queued.
  2. 2Copy the files to your site rootfavicon.ico has to sit at the root. A browser asks for /favicon.ico before it reads a line of your HTML.
  3. 3Paste the snippet into the headOne line per size, plus the manifest and the theme colour.
  4. 4Hard-reload to checkBrowsers cache favicons hard. Ctrl+F5, or open the icon URL directly.