Favicon Generator
Any image → a real .ico plus the full PNG set, with a live browser-tab preview.
Image & design tools
Drop an image here or browse
Square images look best. Non-square gets center-cropped to square.
Adds a filled box behind the logo — useful when the logo is thin and gets lost at 16px.
How far the logo sits from the box edge.
Check how the favicon reads on both.
At 16×16 pixels only bold, simple shapes survive. If your logo is detailed, test at 16px in the tab preview first — you may want the BG Remover to strip a busy background first.
What you get
One image in
Center-cropped to square, scaled with high-quality smoothing, optional padding box.
A real .ico out
Genuine ICO container with 16/32/48 embedded PNGs — not a renamed PNG.
Plus the PNG set
16, 32, 48, 180 (Apple touch), 192 and 512 (PWA/manifest) — with ready-to-paste HTML.
After downloading — paste this in your <head>
Drop the files in your site root. (site.webmanifest is optional — skip that line if you're not doing PWA.)
Favicon — FAQ
Is this a real .ico file?
Yes — a proper ICON container with 16, 32 and 48px PNG entries inside, exactly what browsers expect. Built byte-by-byte, and it works.
My logo looks muddy at 16px.
That's physics, not a bug — 16px is 256 pixels total. Simplify: use just the main glyph of your logo, add a padding box with strong contrast, or run it through BG Remover first to kill a busy background.
Why does the tab preview matter?
The favicon's whole job is to be recognizable at 16px in a crowded tab strip. The preview shows your icon exactly at that size, next to a competitor tab — if you can't tell it's yours, visitors can't either.
Do I need all six PNGs?
No. The .ico alone covers desktop browsers. The PNGs cover bookmarks, Apple touch icons and PWA installs — grab the full set if you're building a proper web app, just the .ico for a simple site.