Favicon Generator

Generate a complete favicon set from one image.

Processed on your device. We never see your files.

How to use Favicon Generator

What this tool does

The Favicon Generator takes a single image and turns it into a complete, production-ready favicon set. It renders your source artwork at every size that modern browsers, operating systems, and search engines expect — from the tiny 16×16 pixel icon shown in browser tabs to the 512×512 version used by Progressive Web Apps. It also builds a multi-resolution favicon.ico file combining four pixel densities, an Apple Touch icon at 180×180 for home-screen bookmarks on iPhones and iPads, and a short HTML snippet with all the required <link> tags pre-filled. Everything is bundled into a single ZIP, ready to drop into your project. No image data leaves your device at any point.

Why you might need it

A single static favicon.ico was enough for websites in the early 2000s. Today the landscape is dramatically more fragmented. Browsers on retina screens pull a 32×32 or 64×64 PNG when it is available. Android Chrome uses a 192×192 icon for home-screen shortcuts. Safari on iPhone needs a 180×180 Apple Touch icon with no rounded corners (iOS applies the radius itself). PWA manifests reference 512×512 icons for splash screens. Skipping any of these means your brand either disappears or looks blurry in exactly the contexts where it matters most — tabs, bookmarks, and home screens that users see dozens of times a day.

Manually resizing and exporting each variant from a design tool is tedious and error-prone. It is easy to forget a size, export at the wrong dimensions, or name files incorrectly. This tool handles all of that in one step.

How to use it

Drop your logo or source image onto the upload zone, or click to browse. A square PNG at 512×512 pixels or larger gives the best results at all sizes.
The tool shows your source image alongside a list of what will be generated. If your image is not square, it notes this and centres the artwork with transparent padding — your icon remains undistorted, not stretched.
Click Generate favicon set. The tool renders each size to a canvas, encodes each one as PNG, assembles the multi-resolution ICO, and packages everything into a ZIP. This takes a moment for very large source images.
Click Download ZIP to save favicons.zip to your device.
Unzip, copy the image files to your site’s root (or a /favicons/ folder), and paste the HTML snippet from favicon.html into your page’s <head>.

Format and quality notes

ICO files built by this tool store each resolution as a PNG stream rather than the older BMP-based encoding, which is fully supported by all modern Windows versions and browsers. The PNG-in-ICO approach gives sharper results and smaller file sizes than the legacy BMP format.

The apple-touch-icon does not need an -apple-touch-icon meta name prefix in the HTML because modern iOS and iPadOS discover it by the rel="apple-touch-icon" attribute on the link tag, which is included in the snippet. If you are placing the file in a subdirectory rather than at the domain root, update each href path in the snippet accordingly.

WebP source files are accepted and handled correctly. AVIF support depends on the browser running the tool. If you experience an error loading an AVIF, convert it to PNG first and re-upload.

Tips for best results

Start with a square image at the highest resolution you have — ideally 1024×1024 or larger. Artwork exported from a vector tool (Figma, Illustrator) at that size will look crisp at all the smaller output sizes.

At 16×16 pixels, detail collapses. Check the preview at that size after generating; if the icon is illegible, create a simplified version of your logo — a monogram, a geometric emblem, or just the key shape in your palette — and regenerate. Many brands use a simplified monogram exclusively at 16×16 and their full logo from 32×32 upward.

Avoid thin lines and small text in the source artwork. Both become invisible at small sizes. Maximise contrast between the icon and common browser chrome colours (both white and dark grey backgrounds) so the icon is visible in light and dark mode tabs.

Once deployed, clear your browser cache and do a hard reload to see the updated favicon. Many browsers cache the old one aggressively.

Frequently asked questions

Is my image uploaded to a server?

No. Your image is processed entirely in your browser using the Canvas API. It never leaves your device, is never sent to any server, and is never stored anywhere. You can verify this in your browser's Network tab — there are no outgoing requests when you use this tool.

What files does the ZIP contain?

The ZIP contains PNG files at 16×16, 32×32, 48×48, 64×64, 96×96, 128×128, 192×192, and 512×512 pixels; an apple-touch-icon.png at 180×180; a multi-resolution favicon.ico combining the 16, 32, 48, and 64 px frames; and a favicon.html text file with a ready-made HTML snippet of all the tags to paste into your page's .

What image size or format should I use as my source?

A square PNG at 512×512 pixels or larger gives the cleanest results at every size. Vector-originated artwork (exported from Figma, Illustrator, or Inkscape as a high-resolution PNG) scales down the sharpest. JPEGs and WebP files work too, but PNG is preferred because it preserves transparency.

Why does my favicon look blurry at 16×16?

At 16 pixels the image has to fit inside a tiny square, so any fine detail is lost regardless of the source quality. The best 16×16 favicons are often hand-crafted or simplified — a single letter, a geometric mark, or a bold coloured shape. If your logo is too complex at small sizes, consider a simplified monogram version.

How do I use the HTML snippet?

Open the downloaded ZIP, copy the contents of favicon.html, and paste them inside the element of every HTML page on your site. Adjust the href paths if your favicon files are stored in a subdirectory rather than the root. Most static site generators and CMS platforms let you add global head tags through a layout or theme file.

Related tools

App Icon Generator

Create iOS, Android, and PWA app icons in every size.

Image to ICO

Convert images into multi-resolution ICO files.

Image Resizer

Resize images to exact dimensions, one at a time or in bulk.

Image Compressor

Shrink image file size while keeping quality high.

Profile Picture Cropper

Crop photos into perfect circles for profile pictures.

Image Format Converter

Convert images between PNG, JPG, WebP, AVIF, GIF, and BMP.