Why isn't my favicon updating?
This is the most common favicon problem, and it is almost always caching. Browsers hold onto favicons harder than most assets. Fix it in this order: hard-refresh (Ctrl+Shift+R / Cmd+Shift+R); if that fails, close the tab entirely and open a new one, because the favicon cache is often tab-scoped; while iterating, add a throwaway version query such as /favicon.ico?v=2 so the browser fetches a "new" file. Google Search keeps a separate copy and refreshes on its own timeline — days to weeks.
Do I still need a favicon.ico in 2026?
Yes. Even with an SVG in place, browsers and Googlebot still request /favicon.ico from the site root automatically, and a few older clients depend on it. It is a tiny file — keep a multi-size .ico (16/32/48) as the reliable baseline.
What sizes do I actually need?
Far fewer than most generators output. The complete, current set is: a multi-size favicon.ico (16/32/48), one icon.svg, an apple-touch-icon.png at 180×180, and 192 + 512 PNGs referenced from your web app manifest. The old 70×70/150×150 Windows tiles and dozens of in-between PNGs are no longer used.
What's the difference between a favicon and an apple-touch-icon?
The favicon (.ico/SVG/PNG) is the small tab and bookmark icon. The apple-touch-icon is a 180×180 PNG iOS uses when someone adds your site to their home screen — shown large and rounded by the OS. iOS does not read your SVG favicon for that, so the dedicated PNG is required.
Can I use an SVG favicon? Do all browsers support it?
Every current desktop and mobile browser renders SVG favicons. Serve the SVG for them and keep a favicon.ico so older browsers — and Google Search — still get an icon. Best of both worlds, two files.
How do I make a dark-mode favicon?
Only SVG can adapt. Put a @media (prefers-color-scheme: dark) rule inside the SVG so its fill changes with the browser's theme — useful when a dark logo would vanish against a dark tab bar. ICO and PNG are fixed bitmaps and cannot switch. There is a full example in Advanced Tips.
Why does Google show the wrong favicon — or none — in search?
Google has specific rules: the favicon must sit at a stable URL, be a square whose size is a multiple of 48×48 (48, 96, 144…), live on the same host as the site, and be on a page Google can index. It also caches the icon apart from the page, so a change can take days to weeks to surface. If Google shows nothing, check that /favicon.ico returns 200 to Googlebot and the page isn't blocked by robots or noindex.
Should my favicon have a transparent background?
Usually yes — a transparent PNG/SVG sits cleanly on light and dark tab bars. The generated .ico keeps a solid fallback for the rare old browser that can't render alpha. If your logo is light-coloured, consider a small solid shape behind it so it doesn't disappear on a white tab strip.
My favicon looks blurry or muddy — why?
Detail dies at 16×16. Wordmarks, thin strokes and gradients turn to mush. Use a single bold glyph or symbol, high contrast, and generous negative space. If a logo has small text, drop the text for the favicon and keep just the mark.
I see favicon.ico 404s in my server logs — is that a problem?
Only that you have no favicon. Browsers request /favicon.ico automatically, so a missing file shows up as repeated 404s. Add the file at the root and they stop.
Does a favicon affect SEO?
Not as a ranking factor. But Google Search does display your favicon next to the result on mobile, so a clear, recognisable icon improves click-through — an indirect win, not a ranking boost.
Is my image uploaded anywhere?
No. The generator runs entirely in your browser via the Canvas API — the image never touches a server. That is why it works with your private artwork and even offline.