Favicon generator.
Create every icon a modern website needs from one image, or from a letter or emoji on a coloured background: favicon.ico, PNG icons in the sizes Google accepts for search results, the Apple touch icon, Android icons and a web manifest. Download them in one ZIP, with the HTML to paste.
- Free, no sign-up
- Runs in your browser. Nothing you enter is sent to us.
Preview
How to use the favicon Generator
- Choose a source: upload your logo (square works best), or type a letter or emoji.
- Pick background colour, shape and padding, and check the small previews: that's how it will look in a browser tab.
- Download the ZIP.
- Upload the files to your website's root folder and paste the HTML into the <head>.
Which files you need, and why
- favicon.ico (16, 32 and 48 px inside): the classic file browsers look for at /favicon.ico.
- PNG icons at 48, 96 and 144 px: Google only shows a site icon in search results if it's square and a multiple of 48 px.
- apple-touch-icon.png (180 px): used when someone adds your site to an iPhone home screen. It has a solid background, because iOS fills transparency with black.
- icon-192 and icon-512 PNGs plus site.webmanifest: used by Android and when the site is installed as an app.
Designing an icon that works at 16 pixels
A favicon is tiny: in a browser tab it's 16 or 32 pixels across. Detailed logos and words turn to mush. Use a simplified mark, a single letter, or a symbol from your logo, with strong contrast and a little padding. Check the 16 px preview: if you can't tell what it is there, simplify.
Getting Google to show it
Google picks up your favicon from the <link rel="icon"> tags on your home page, and it can take days or weeks to appear in results. The home page and the icon files must both be crawlable (not blocked in robots.txt). If an old icon keeps showing after a change, browsers are caching it: add a version number to the file links, as the HTML here does. To check the rest of your page's tags, use our meta tag generator.
About the favicon Generator.
What size should a favicon be?
Provide several: a favicon.ico with 16, 32 and 48 px, PNGs at 48, 96 and 144 px for Google, 180 px for Apple, and 192 and 512 px for Android. This tool creates them all.
Why doesn't Google show my favicon?
Google needs a square icon that is a multiple of 48 px, linked from your home page, and crawlable. It can take a few weeks to update.
Can I use an emoji as a favicon?
Yes. Type it in the text option. It is drawn with your device's emoji style, so it may look slightly different from other devices' versions.
Is my logo uploaded?
No. Every icon is made in your browser.
Where do I put the files?
In your website's root folder (public_html on cPanel), so favicon.ico opens at yourdomain.com/favicon.ico. In WordPress you can also set a Site Icon under Appearance, Customize.
You might also need these.
Image Resizer & Converter
Resize images by pixels or percentage, and convert between JPG, PNG and WebP. Batch, in your browser.
Use the toolSVG to PNG Converter
Convert SVG files or code to sharp PNG, JPG or WebP at any size, with a transparent or solid background.
Use the toolColour Palette Generator & Image Colour Picker
Pull a palette from any image, pick exact colours, or build harmonies from one brand colour.
Use the toolWant this done for you?
Free tools show you what to fix. We fix it, measure it, and keep it working while you run the business.