Favicon Generator
Upload any image and get browser-ready favicon sizes instantly. Works entirely in your browser.
What Is a Favicon Generator?
The favicon is the tiny icon in your browser tab — 16 pixels of brand that users subconsciously navigate by. With a dozen tabs open, nobody reads titles; they hunt for the little logo they recognize. This generator turns any image into a proper favicon: upload your logo or graphic, and download it as a clean 32×32 PNG, the size modern browsers use for standard and retina tabs, ready to drop into your site.
Favicons arrived with Internet Explorer 5 in 1999 as "favorites icons" for bookmarked sites, and the name stuck even as their job expanded. Today the same small file represents your site in tabs, bookmarks, history, mobile home screens, and search results on some platforms. A missing favicon signals an unfinished site — browsers display a generic globe or blank page icon — while a crisp one is a quiet, permanent brand impression repeated every single visit.
How to Use the Favicon Generator
- Click "Upload image" and choose your logo or graphic (a square image works best).
- The tool scales it to favicon dimensions — preview how it reads at small size.
- Click "Download 32×32 PNG" and save the file.
- Add it to your site with the link tag below and upload it to your site's root or images folder.
Adding the Favicon to Your Site
Place this line in the <head> of your pages, adjusting the path to where you uploaded the file: <link rel="icon" type="image/png" sizes="32x32" href="/favicon.png">. Historically sites used a special .ico file named favicon.ico in the root directory, which browsers still request automatically; modern PNG favicons declared with the link tag are the simpler current standard and fully sufficient for tabs and bookmarks. After adding it, hard-refresh your site (or open it in a private window) — browsers cache favicons aggressively, which is why yours may not appear to change immediately.
Designing an Icon That Survives 16 Pixels
- Simplify ruthlessly: one letter, one symbol, one bold shape. Full logos with taglines become mush at tab size — use the monogram or mark instead.
- Demand contrast: a light icon on a transparent background vanishes on light browser themes; a solid background color in brand hues reads everywhere.
- Test at actual size before committing: if you cannot identify it squinting at 16×16, it is too detailed.
PNG or ICO — which format should I use?
PNG is the practical modern choice: universally supported by current browsers for tab icons, easy to produce (as here), and declared with a simple link tag. The ICO container persists for legacy reasons and can bundle several sizes in one file, which some larger sites still prefer. For the overwhelming majority of websites, a 32×32 PNG declared in the head — plus optionally a 180×180 for Apple touch icons — covers everything users will ever see.
Why does my favicon look blurry?
Usually because the source image was small, detailed, or not square, and downscaling averaged its detail into fog. Start from the largest, simplest version of your mark you have (vector exports are ideal), keep shapes chunky, and avoid thin lines and small text. A favicon is a pictogram, not a poster — the designs that read best at 16 pixels look almost crudely bold at full size.
I uploaded the favicon but the old one still shows. Why?
Favicon caching is notoriously sticky: browsers store icons separately from page cache, sometimes for days. Verify with a private/incognito window or a different browser, append a version query to force a refresh (href="/favicon.png?v=2"), and confirm the file path in your link tag matches the uploaded location exactly. Search engines update favicons on their own crawl schedule, which can lag further.
Can I use a photo as a favicon?
You can, but faces and photos compress poorly into 16 legible pixels — the result is usually an unrecognizable smudge. If the photo is your brand (a personal site, a creator page), crop tight on the single most distinctive element, boost contrast, and test at real size. Most personal brands do better with an initial letter in brand colors, generated from the same graphic style as their logo.