This favicon generator turns a logo, a photo or one or two letters into every icon file your site needs: favicon.ico, the PNG sizes for phones and Google, and the HTML lines for your page head. Pick an image or type a letter, check the preview in a browser tab and in a Google result, then download the files one by one or as a zip. Nothing is uploaded; the icons are drawn in your browser.
A favicon is the small square picture next to your page title in a browser tab. Google also shows it next to your site name in search results, mostly on phones. When it is missing, Google shows a plain grey globe, and your result looks less finished than the ones around it.
What does Google need from a favicon?
Google lists a few simple rules for the icon it shows in search. Most problems come from breaking one of them without knowing it.
- Square shape. The width and the height must be the same. A wide logo gets squeezed or ignored.
- A multiple of 48 pixels. Use 48×48, 96×96, 144×144 or bigger. Google scales it down, so a larger clean file is fine.
- A file Google can crawl. The icon and the home page must not be blocked in robots.txt, and the icon address must not need a login.
- A stable address. Do not change the file name every week. Google refreshes favicons slowly.
- Something people recognize. A rude or misleading picture can be replaced by the default icon.
The tool follows these rules for you. Every PNG it makes is square, and the main sizes are multiples of 48.
How to use the favicon generator
- Choose a source. Use the Image tab for a logo (PNG, JPG, WebP or SVG), or the Text tab for one or two letters or an emoji on a coloured background.
- Keep it simple. Fine lines and small words vanish at 16 pixels. One bold letter or a simple shape works best.
- Check the previews. Look at the fake browser tab and the fake Google result in light and dark mode. If you cannot read it there, simplify it.
- Download the files. You get favicon.ico (16, 32 and 48 px inside one file), PNG files in 48, 96, 180, 192 and 512 px, a site.webmanifest and the HTML tags.
- Upload them to the main folder of your site, usually public_html, so the icon lives at an address like /favicon.ico.
- Paste the HTML tags into the head of your pages, before the closing head tag.
Which file is used where?
| File | Used by |
|---|---|
| favicon.ico | Older browsers and any tool that asks for /favicon.ico |
| PNG 48 and 96 | Browser tabs and Google search results |
| apple-touch-icon 180 | iPhone and iPad home screen |
| PNG 192 and 512 | Android home screen, through site.webmanifest |
You do not need every file for Google. The 48 or 96 pixel PNG with a link tag is enough for search. The other files make the icon look sharp when people save your site on a phone.
How do I add the favicon in my CMS?
In the Bloghints CMS, go to Admin › Settings › Favicon and upload the 512 pixel PNG. The CMS adds the head tags for you. In WordPress, open Appearance › Customize › Site Identity and set the Site Icon. On a plain HTML or PHP site, upload the files and paste the tags from this tool into your header file.
When the files are in place, open the icon address in your browser, for example yoursite.com/favicon.ico. You should see the icon, not an error page. Then run the free Website SEO Checkup again. The Favicon row should turn green.
Why is my favicon still not showing in Google?
Google needs time. It finds the new icon the next time it crawls your home page, and the result can take days or a few weeks to change. You can ask for a new crawl of the home page with URL Inspection in Google Search Console, but there is no button that refreshes the icon at once.
If weeks pass and nothing changes, check three things. The icon link must be in the head of the home page, not only on inner pages. The icon file must answer with status 200, not a redirect to a login page. And robots.txt must not block the folder that holds the icon. Our guide Favicon Not Showing in Google? walks through each cause step by step.
Use the favicon generator once, upload the files, and leave the address alone after that. A stable, square icon is all Google asks for. For the rest of your page head, the Meta Tag Generator writes the title, description and social tags.
Frequently asked questions
What size should a favicon be?
Make the source at least 512×512 pixels and square. Google asks for a multiple of 48 pixels, such as 48, 96 or 144. Browsers use 16 and 32 pixels inside favicon.ico, and phones use 180, 192 and 512.
Do I still need favicon.ico?
It is not required, but it is cheap insurance. Some browsers, feed readers and tools still ask for /favicon.ico by default. Keep one in your main folder next to the PNG files.
Can I use an SVG favicon?
Modern browsers accept an SVG icon, and Google supports SVG too. Keep a PNG version as well, because some apps and older browsers only read PNG or ICO files.