Create favicons from text, emoji, or uploaded images — download as PNG in all standard sizes
Text / Emoji
Upload Image
Drop an image here or click to upload
PNG, JPG, SVG, GIF supported
Preview
Download Sizes
Favicon Best Practices
Modern browsers support multiple favicon formats and sizes. For best results:
32x32 — Standard favicon (tab icon)
16x16 — Address bar / bookmark icon
180x180 — Apple Touch Icon (iOS home screen)
192x192 / 512x512 — Android Chrome manifest icons
Use square designs — most browsers crop to square
Avoid fine detail — favicons render at tiny sizes
Favicons: Which Sizes You Actually Need
The favicon is the small icon shown in browser tabs, bookmarks, history entries, and on a phone home screen when someone saves your site. It is the smallest piece of branding you own and one of the easiest to get subtly wrong, because different platforms want different sizes and formats. This generator produces the set that covers real-world use without shipping a dozen redundant files.
The sizes that matter
32x32 is the workhorse for desktop browser tabs on standard displays.
16x16 still appears in some bookmark lists and older interfaces.
180x180 is the Apple touch icon used when someone adds your site to an iOS home screen.
192x192 and 512x512 are referenced from a web app manifest for Android home screens and install prompts.
An SVG icon scales to any size and can adapt to dark mode, which modern browsers will prefer when offered.
How browsers find the icon
Browsers look for /favicon.ico at your domain root automatically, which is why that file still exists as a fallback. Everything beyond that is declared with link tags in your document head: rel="icon" for standard icons with a sizes and type attribute, and rel="apple-touch-icon" for the iOS home screen version. Android home screen icons come from the icons array in your web app manifest rather than a link tag.
Designing for 32 pixels
A favicon is not a shrunken logo. At 32 pixels square, fine strokes disappear, gradients turn to mud, and text becomes an unreadable smear. The icons that work are built from a single bold shape with high contrast against both light and dark tab bars. If your logo is a wordmark, use its first letter or its distinctive symbol rather than the whole thing.
How to use it
Upload a square source image, ideally 512x512 or larger so downscaling stays sharp.
Generate the icon set and download it.
Place the files at your site root and add the generated link tags to your document head.
Check the result in a tab against both a light and a dark browser theme.
Tips
Test on a dark tab bar. A dark icon with no light outline can vanish entirely.
Favicons cache aggressively. Force a reload or use a fresh filename when testing a change.
Leave a little padding inside the square, since some platforms crop the icon to a rounded shape.
Frequently asked questions
Is favicon.ico still required? Not strictly, but keeping one at the root is a harmless fallback for older clients and bare requests.
Can I just use an SVG? Modern browsers will use it, but ship PNG sizes too for platforms that do not.
Why is my old icon still showing? Almost always caching. Hard refresh, or rename the file.
A favicon is the small icon a browser shows in the tab, the bookmark list, and the history. Modern sites do not ship a single file; they provide a small set so that each context gets a crisp icon. The generator above produces the markup that links those files from your head.
The files that cover most cases
A practical set is a scalable SVG icon for browsers that support it, a PNG or two for standard tabs, an apple-touch-icon at 180 by 180 pixels for iOS home screens, and a traditional favicon.ico as a fallback for older browsers. The icons are declared with link elements using rel="icon" and, for Apple devices, rel="apple-touch-icon".
Placement and caching
Browsers look for the icon links in the head, and they cache favicons aggressively, so if you change an icon and do not see the update, a hard refresh or a filename change usually forces it. Keep the source artwork simple, because these icons are often displayed at 16 by 16 pixels where fine detail disappears.