BrowserTools

Favicon Generator

One image to a complete favicon pack

By Guga — BrowserTools maintainer, Tbilisi, Georgia Updated 2026-09-17
Free Private No uploads
What is Favicon Generator?

Finishing a website's icons properly is about seven files and a block of head markup, and getting it right is fiddly enough that people skip it. This produces the whole set from a single image. You get a multi-size favicon.ico containing the 16, 32, and 48 pixel renditions; standalone PNGs at those same sizes; apple-touch-icon.png at 180, which is what iOS uses when someone bookmarks your site; and icon-192.png and icon-512.png for the manifest icons that modern browsers and installable web apps look for. All of it arrives in one ZIP named favicon-pack.zip alongside a README with the copy instructions. The HTML link tags are displayed on the page too, so you can paste them without opening the archive. Every rendition is redrawn onto a square canvas, so begin with square artwork or the proportions will be distorted.

Upload a PNG or JPG and get a full favicon pack: multi-size .ico file, modern PNG icons, and ready-to-paste HTML tags. The fastest way to finish any website setup.

Private Favicon Generator In Your Browser

Favicon Generator is processed locally with client-side JavaScript. Your files never touch a server, and there is no queue to wait in.

Step-by-Step

How to use Favicon Generator

1

Drop a PNG, JPG, or SVG onto the Drop your logo or image area — squares and simple shapes produce the best results.

2

Press Generate favicon pack to render the six PNG renditions and assemble the 16/32/48 .ico.

3

Review the sized previews and the <link> tags shown beneath them.

4

Press Download complete pack (ZIP) to get favicon.ico, the six PNGs, and a README with setup instructions.

Key Capabilities
  • Produces favicon.ico containing 16, 32, and 48 pixel renditions in the modern container format
  • Ships standalone PNGs at 16, 32, 48, 180 (apple-touch-icon), 192, and 512 pixels
  • Accepts PNG, JPG, WebP, or SVG as the source image
  • The ZIP includes a README with setup steps, and the required <link> tags are shown on the page for copying
Common Use Cases
  • A web developer launching a new site and needing the complete icon set in one download instead of seven.
  • A designer handing a client a finished favicon package rather than a single square PNG.
  • A developer adding installability to a progressive web app, which needs the 192 and 512 pixel icons.
Clear Answers

Frequently Asked Questions

Why is my logo squashed?
Every rendition is drawn onto a square canvas at that exact width and height, so a wide or tall source gets compressed rather than cropped or padded. Pad your artwork to a square in your editor first and the results will look correct.
Which of these files does my site actually need?
favicon.ico covers every browser and is the important one. The apple-touch-icon at 180 pixels is what iOS shows on the home screen, so a site without it gets a screenshot thumbnail. The 192 and 512 PNGs are only needed if you ship a web app manifest.
Is SVG input actually rasterised?
Yes. The source is decoded by the browser and redrawn at each target size, so you get a PNG rendition of your vector rather than the vector embedded as-is. That is what the 192 and 512 pixel icons require.
Is the logo uploaded?
It is not. The resampling and the .ico container are both assembled on your machine, with no upload step involved.

Related Guides

View all guides →
imageFavicon Sizes: What Your Website Actually NeedsA favicon is one small square of artwork that a browser requests at particular sizes, so a site needs a few purpose-built renditions rather than a single export scaled into every slot. Which pixels each context asks for, why a multi-size .ico still earns its place, and how the pieces are declared is below; to build the whole set from one image, the favicon generator linked from this guide produces the files and the tags.