Favicon Generator
nothing stored

What this favicon generator makes

One image in, a complete icon pack out. Every file is named the way browsers and phones look for it.

favicon.ico holds three sizes in one file: 16 px for browser tabs, 32 px for high-resolution tabs and the taskbar, and 48 px for desktop shortcuts. Each size inside is a compressed PNG, which every current browser reads.

favicon-16x16.png and favicon-32x32.png are the same tab icons as separate PNGs, which modern browsers prefer when you list them.

apple-touch-icon.png (180 px) is what an iPhone or iPad shows when someone adds your site to the home screen.

android-chrome-192x192.png and android-chrome-512x512.png are used by Android and by installed web apps, and are listed in site.webmanifest.

favicon-head-tags.html holds the exact tags to paste into your page's head.

Every size is resampled from one large master with a sharp resampling filter, so small icons stay as crisp as the pixels allow.

How to add a favicon to your website

1. Choose your logo and press Make favicons. 2. Press Download all to save one .zip with every file. 3. Unzip it and upload every file to the root of your site, the same folder as your home page, so they live at addresses like yoursite.com/favicon.ico. 4. Open favicon-head-tags.html, copy the tags and paste them inside the head section of your page template. 5. Optionally, open site.webmanifest and fill in your site's name and short name.

Browsers cache favicons hard. If you still see the old icon, open the site in a private window or clear the cache before assuming something went wrong.

On hosted builders and store platforms, look for a "favicon" or "site icon" setting instead. They usually ask for one square PNG: use android-chrome-512x512.png from the pack.

Designing an icon that reads at 16 pixels

A favicon is shown at 16 by 16 pixels in most tabs. That is 256 pixels in total, so detail that looks good in your logo simply disappears.

Use a mark, not a wordmark. A full company name becomes a gray smear at 16 px. Use a symbol, a monogram or the first letter.

Go bold. Thin lines vanish. Thick shapes and strong contrast survive.

Mind the padding. A little padding (5–10%) stops the icon feeling cramped, but too much makes it tiny. Leave padding at 0 for a mark that is already drawn with space around it.

Check dark mode. The preview shows your icon in a light and a dark tab. A black logo on a transparent background disappears in dark tabs; if that happens, pick a white or colored background.

Fill or fit. Whole image keeps a wide logo complete but small. Fill square crops it from the center to use every pixel.

Transparent, white or colored backgrounds

Transparent lets the tab color show around your mark. It looks most native in browser tabs, but check the dark-tab preview: dark marks can vanish.

White gives a clean tile that reads on any tab color. It suits dark or colorful logos.

Color fills the icon with a brand color. Combined with Rounded or Circle in Advanced, it makes the tile-style icon many apps use.

One exception is built in. iPhones draw transparent home-screen icons on black, which rarely looks intended, so the Apple icon always gets a solid background: your chosen color, or white if you chose transparent. iOS applies its own rounded mask, so the Apple icon is left square on purpose.

The background color is also written into site.webmanifest as the theme color, which Android uses for the browser bar and splash screen.

Making Favicons From Unreleased Logos Privately

Your logo never leaves your device. The icons are drawn on your browser's canvas, resampled on your device, and favicon.ico is assembled byte by byte in your browser. Nothing is uploaded or saved on our servers.

That matters for unreleased brands and client work. A new logo is often confidential until launch, and many online favicon tools send the file to their server to do the job.

It is also quick: the whole pack is ready in about a second, and you can try backgrounds, padding and shapes as often as you like, since every run starts from your original.

A free sign-in, which you need after the first few downloads, does not change any of this. Signing in never sends your image anywhere.

Free favicon generator vs the paid AI image generator

The free favicon generator turns an image you already have into every icon a site needs. It is quick, private and unlimited. The first few downloads need no account, and then a free sign-in keeps them coming.

What it cannot do is design the icon. If you have no logo yet, or your logo is a long wordmark that will never read at 16 pixels, you need a simple mark first.

The paid Imagera AI image generator creates artwork from a short description: a monogram, a flat symbol, a mascot or an emblem in the colors you name. Generate a few options, pick one, and bring it back here to make the favicon pack. The generator runs in the cloud, uses credits and keeps your results.

Have a logo? Stay with the free tool. Need one? Start with the generator.