Generate a favicon
Drop in a logo and get favicon.ico, the PNG icons iOS and Android expect, a web manifest, and the HTML to paste into your head. Previewed at true size, because 16 pixels is the real test.
Your file is processed on your device and is never uploaded.
What this tool does
- A real multi-size favicon.ico, plus the PNGs modern browsers prefer
- Previewed at 16px, where most favicons fall apart
- Runs on your device — unreleased branding stays private
How to use favicon generator
-
Add your logo
A square image works best. Others are cropped from the centre.
-
Check the 16px preview
If it is unreadable there, simplify the artwork before shipping it.
-
Download and paste
Unzip into your site root and paste the HTML into your head.
Frequently asked questions
Do I still need favicon.ico?
It is worth having. Modern browsers prefer the PNG links in your HTML, but browsers still request /favicon.ico by default, and some feed readers and bookmark tools only look for that. It is a small file, so including it costs almost nothing.
Why does my logo look like a smudge at 16 pixels?
Because 16 x 16 is roughly 250 pixels in total — less than a single letter of body text. Fine lines, gradients and wordmarks all disappear. The fix is artwork, not export settings: use one bold shape or a single letter for the small sizes.
What is inside the .ico file?
Three PNG images, at 16, 32 and 48 pixels, wrapped in the ICO container. The format originally held raw bitmaps, but has accepted embedded PNGs since Windows Vista and every browser in use understands them — which makes for a smaller file.
Why so few files? Other generators produce dozens.
Most of those lists are historical. The long chains of apple-touch-icon sizes date from iOS 6, and the msapplication tiles from Windows 8; current iOS scales one 180px icon and Android reads the manifest. Six files and a manifest cover every browser in real use.
Should the background be transparent?
Transparent suits a logo that already has its own shape and needs to sit on both light and dark browser chrome. Choose a solid colour if your mark is thin or light-coloured, since a transparent one can vanish against a matching background.