User Guide
- Upload your logo or icon — square PNG, JPG, WebP or SVG images work best.
- Optionally add a background colour and choose square, rounded or circle corners.
- Preview every size, then download favicon.ico (16+32+48 in one file) and the PNG set (Apple touch + Android/PWA).
- Copy the ready-made HTML snippet and paste it into your site’s <head>.
About the Favicon Generator
A favicon is the tiny icon browsers show in tabs, bookmarks, history and search results — the difference between a site that looks finished and one that shows a generic grey globe. This free generator takes one logo image and produces the complete modern favicon set: a genuine multi-size favicon.ico (16, 32 and 48 px in a single file, built to the real ICO binary format), the 180 px Apple touch icon iPhones use for home-screen bookmarks, and the 192/512 px PNGs Android and PWAs require — plus the exact HTML snippet to wire them up.
Why so many sizes?
Each platform reads its own size: browser tabs use 16/32 px, Windows taskbar pins prefer 48, iOS home screens take 180, and Android/Chrome install prompts want 192 and 512. Ship only one and everything else gets an ugly upscale or a blank. The generator renders each size individually from your source image (not by shrinking one master PNG badly), which keeps small sizes crisp — the pixelated previews show exactly what your tab will look like.
Design tips that actually matter at 16 pixels
At tab size, detail dies. Use the background option if your logo is a thin line-mark — a solid colour behind it survives shrinking far better than transparency over an unknown tab colour. The circle crop instantly matches the app-icon look; rounded corners read as “modern product”. If your logo is wordmark-only, favicon best practice is one letter — crop before uploading, or upload the letter portion. Test the 16 px preview: if you can’t tell what it is, neither can your visitors.
Installing on your site
Upload the downloaded files to your site root, paste the copied snippet into your <head>, done. WordPress users can instead use Appearance → Customize → Site Identity with the 512 px PNG. Browsers cache favicons aggressively — if the old icon lingers, hard-refresh or append ?v=2 to the href once. Everything is generated locally in your browser; your logo is never uploaded. Pair with the Image Resizer for social-media profile sizes and the WebP Converter for the rest of your site’s images.
Frequently Asked Questions
What sizes does a favicon need in 2026?
A favicon.ico with 16/32/48 px for browsers, a 180 px Apple touch icon for iOS, and 192/512 px PNGs for Android and PWAs. This generator produces all of them from one image, plus the HTML.
Is the favicon.ico a real ICO file?
Yes — a genuine multi-size ICO binary containing 16, 32 and 48 px versions in one file, the format browsers and Windows expect. Not a renamed PNG.
What image should I upload?
A square logo at 512 px or larger works best. Simple, bold marks survive shrinking to 16 px; thin wordmarks don’t — use the background and corner options, or crop to a single letter.
Why does my old favicon still show after updating?
Browsers cache favicons aggressively. Hard-refresh (Ctrl+F5), or add ?v=2 to the favicon href once to force every visitor’s browser to fetch the new icon.
How do I add the favicon to WordPress?
Easiest: Appearance → Customize → Site Identity → Site Icon with the 512 px PNG. Or upload the files to your site root and paste the generated snippet into your theme’s header.