Generate a favicon set
One ZIP with a real multi-resolution .ico, every PNG size modern browsers ask for, and the markup to paste into your <head>.
- Runs in your browser
- Nothing is uploaded
- No sign-up
- No watermark
Drag & drop your image here
or tap to browse · you can also paste from the clipboard
JPG · PNG · WebP · GIF · BMP · AVIF · SVG · up to 50 MB each
Choose an imageBefore
After
Processed image will appear here.
How to use the favicon generator
Upload a square image of at least 512 × 512 px and download the ZIP. It contains a real multi-resolution favicon.ico, PNG icons from 16 to 512 px, and the HTML snippet to paste into your <head>. Upload the files to your site root.
- Upload a square image512 × 512 px or larger works best. SVG and PNG give the cleanest edges.
- Choose sizes and backgroundKeep transparency, or paint a solid colour behind the icon.
- Download the ZIPIt contains favicon.ico, every PNG size and the ready-made HTML snippet.
About this tool
A complete favicon set is not one file. Browsers request a 16 px icon for tabs, 32 px for bookmarks and retina tabs, 180 px for iOS home screens, and 192/512 px for Android and PWA manifests. Miss one and it shows: blurry tab icons or a blank square on someone's home screen.
The .ico produced here is a real icon container. The 16, 32 and 48 px entries are written as 32-bit BMP frames with a proper AND mask, the structure Windows and older browsers expect, rather than a PNG with the extension renamed.
What you get
- Real multi-resolution favicon.ico with BMP icon frames
- PNG icons from 16 px to 512 px
- Copy-ready <link> markup for your <head>
- Contain or cover fitting with optional background fill
- One ZIP with everything, built in the browser
When to use the favicon generator
Launching a new site
A missing favicon leaves a generic page icon in every browser tab and a 404 in your server logs on every page load.
Adding PWA support
The 192 and 512 px icons are required by the web app manifest for install prompts and splash screens.
iOS home screen icons
Without a 180 px apple-touch-icon, iOS renders a shrunken screenshot of your page instead.
Rebranding
Regenerate the whole set from a new logo in one pass rather than exporting each size by hand.
What each size is for
| Size | Used by | Required? |
|---|---|---|
| 16 × 16 | Browser tabs, address bar | Yes |
| 32 × 32 | Bookmarks, retina tabs, Windows taskbar | Yes |
| 48 × 48 | Windows site shortcuts | Recommended |
| 96 × 96 | Google TV, desktop shortcuts | Optional |
| 180 × 180 | iOS home screen (apple-touch-icon) | Yes |
| 192 × 192 | Android home screen, PWA manifest | Yes |
| 512 × 512 | PWA splash screen, app listings | Yes |
| favicon.ico | Root request every browser makes | Yes |
How it works
The .ico produced here is a genuine icon container, not a PNG with the extension renamed. Entries at 16, 32 and 48 px are written as 32-bit BMP frames with a proper AND transparency mask, which is the structure Windows and older browsers expect. Each frame carries a bottom-up BGRA pixel array and a 1-bit mask row-padded to a four-byte boundary, exactly as the ICO specification requires.
ICO entry dimensions are stored in a single byte, where zero means 256. That makes 256 px the largest frame an .ico can legally describe, which is why a 512 px selection contributes a PNG file to the ZIP but not a frame inside the icon.
Design matters more than tooling at these sizes. A 16 px icon is 256 pixels in total, roughly the area of a single letter in this sentence. Fine detail, thin strokes and small text are simply not resolvable. Bold shapes, a single letter, or a simplified version of your logo mark are what work. Test the 16 px output at actual size before shipping it.
Common problems and how to fix them
- My favicon does not appear after uploading
- Browsers cache favicons aggressively. Try a hard refresh, an incognito window, or visit /favicon.ico directly to confirm the file is being served.
- The 16 px icon is an unreadable blur
- Your source has too much detail for the size. Simplify to a bold mark or a single letter. This is a design constraint, not a conversion problem.
- The icon looks squashed
- Your source is not square. Use Contain fit to letterbox it, or crop to 1:1 first with the Image Cropper.
- iOS shows a screenshot instead of my icon
- The apple-touch-icon link is missing. The generated snippet includes it, so make sure the 180 px file is uploaded and the path matches.
- The transparent icon looks bad on a dark browser theme
- Enable the background colour so the icon has a defined field, or design a mark that reads on both light and dark.
Frequently asked questions
Which favicon sizes do I actually need?
At minimum 16, 32, 180 (Apple touch icon) and 192 + 512 for the web app manifest. The 48 px entry inside the .ico helps Windows shortcuts. The defaults here cover all of it.
Do I still need favicon.ico?
Yes. Browsers request /favicon.ico from the site root even when no <link> tag points at it, so a missing file means a 404 on most page loads. It also remains the most compatible format for Windows shortcuts.
What image should I start from?
A square design at 512 px or larger, with bold shapes and heavy strokes. Fine detail and small text are unreadable at 16 px, so simplify before you generate, not after.
Where do I put the favicon files?
Upload them all to your site root (public_html on Hostinger), then paste the generated snippet into the <head> of every page. The included head-snippet.html file has the exact markup.
Can I use a photo as a favicon?
Technically yes, but photos are unrecognisable at 16 px. A simple logo mark, monogram or symbol on a solid background works far better.
Is the generated .ico a real icon file?
Yes. The 16, 32 and 48 px entries are 32-bit BMP frames with AND masks, verified to load in Windows' own icon handling. It is not a renamed PNG.