Create a favicon for your website — free
A favicon is the tiny icon in the browser tab next to your page title — and it also becomes the bookmark icon and the home-screen icon when someone saves your site on their phone. A clean favicon makes a site look finished and professional. This free favicon generator creates every file you need from an image, a single letter, or an emoji, then gives you the exact HTML to drop into your site.
It produces a multi-size favicon.ico plus modern PNG icons at 16, 32, 48, 180, 192 and 512 pixels — covering desktop browsers, bookmarks, Apple's touch icon and Android/PWA home screens. Everything is generated locally in your browser, so your logo is never uploaded, and there's no signup or watermark.
How to use it
- Choose From Image and upload a square logo, or Text / Emoji and type a letter or emoji.
- For text mode, pick a background colour, text colour and shape.
- Check the live previews, including the browser-tab mock-up.
- Download favicon.ico and the PNGs, then copy the HTML into your page's <head>.
Which favicon files do you actually need?
For a modern site, a small set covers everything: favicon.ico for classic browser support, a 32px PNG for sharp tabs on high-resolution screens, a 180px apple-touch-icon for iPhones and iPads, and 192px and 512px PNGs referenced in your web manifest for Android and installable PWAs. This tool outputs all of them so you don't have to resize anything by hand.
How to add it to your website
Put the downloaded files in your website's root folder (the same place as your homepage), then paste the generated <link> tags into the <head> of your HTML. Browsers cache favicons aggressively, so after uploading you may need to hard-refresh or open the icon URL directly to see the change. The tool's code snippet uses standard paths so it works on most setups out of the box.
Design tips for a great favicon
Favicons are displayed as small as 16×16 pixels, so simplicity wins. Use a single bold symbol, a strong initial letter, or a recognisable mark rather than a detailed logo with text. Pick high contrast between the icon and its background so it stays legible on both light and dark browser themes, and keep important elements away from the edges. When in doubt, test how it looks in the tab preview above.
favicon.ico vs PNG icons vs apple-touch-icon
You'll see a few different favicon files and it helps to know what each is for. The classic favicon.ico is a single file that can hold several small sizes (16, 32, 48) and is understood by every browser, old and new. PNG favicons (16 and 32) give crisper tabs on modern high-resolution screens. The apple-touch-icon (180×180) is what iPhones and iPads use when someone adds your site to their home screen. The 192 and 512 PNGs are referenced by your web manifest for Android and installable web apps (PWAs). This tool makes all of them together so every device shows a proper icon.
Free and private
There are no limits, no accounts and no watermarks. Because the icons are rendered on a canvas inside your browser, your image stays entirely on your device. Generate as many favicons as you like for any project.