The website favicon is shown in Google search results and can enhance the presentation of your search snippet, resulting in more clicks and brand awareness.
In this guide, you'll learn how to create and add a favicon to your website according to Google standards.
What Is a Favicon?
A favicon is a small, square image that represents your website. It is also known as a website icon, favorite icon, or bookmark icon. It appears in browser tabs, bookmark lists, and, most importantly, in Google search results next to your website's name.
A favicon helps users quickly recognize and click through to your site, enhancing your brand's visibility and credibility.
Here is an example of a favicon in a browser tab.
And here is how it looks in Google search results.
For the favicon to appear in Google search results, it has to meet certain guidelines and be added correctly to your website.
Let's see how to create a favicon that meets Google standards.
How To Create a Favicon? (Tools & Specifications)
Follow these steps:
1. Design the Icon
Use a graphic design tool like Adobe Photoshop or Illustrator or a free alternative like Canva to design a favicon that accurately represents your brand. Keep it simple: a letter, a symbol, or a simplified version of your logo works better than a detailed image.
2. Use the Correct Dimensions
Your favicon must be square (1:1 aspect ratio). Google’s minimum is 8x8 pixels, but it recommends using an icon larger than 48x48 pixels so it looks good on every surface. A 512x512 pixel source image is a good choice, because you can scale it down for other uses.
Favicons are shown very small, so check that yours is still recognizable at 16 or 32 pixels.
3. Ensure Proper Padding for Clear Display
Ensure your favicon has enough padding around the main design. Google may display it inside a circle, so padding keeps the edges from being cut off and the design clear and professional.
4. Export the Image
Google Search supports favicons in BMP, GIF, ICO, PNG, JPEG, PPM, and TIFF formats. PNG is the simplest choice for most sites. ICO is still widely used because it can hold several sizes in one file; if you want one, a free converter like ConvertICO turns a PNG into an ICO file.
5. Upload the File to Your Website
Upload the file to your website or CDN. Many sites name it favicon.ico (or favicon.png) and place it in the root folder, so it’s available at an address like https://www.example.com/favicon.ico, but Google doesn’t require a specific name or location. What matters is the link tag in the next step, and that the URL stays the same over time.
How To Add Favicon To Google
Add this code to the <head> section of your home page to tell Google where your favicon is. The href attribute can be a relative path or a full URL:
<link rel="icon" href="https://www.example.com/favicon.ico">
Google also reads rel="shortcut icon", rel="apple-touch-icon", and rel="apple-touch-icon-precomposed", so if your site already uses one of those, you don’t need to add another.
According to Google’s favicon guidelines, your favicon is only eligible to appear in search results if:
- It’s square and at least 8x8 pixels (larger than 48x48 recommended), in a supported format.
- Googlebot can crawl your home page and Googlebot-Image can crawl the favicon file.
- It visually represents your brand.
- Its URL is stable and doesn’t change often.
- It doesn’t contain inappropriate imagery, such as pornography or hate symbols.
Google shows one favicon per hostname. A subdomain like blog.example.com can have its own favicon, but a subfolder like example.com/blog uses the favicon of example.com. Even when you follow every rule, Google doesn’t guarantee that your favicon will appear.
WordPress Websites
For WordPress websites with a classic theme, you can set your site icon in the Site Identity settings.
Click Appearance from the left menu and then Customize.
Click on Site Identity, select your image under Site Icon, and then click Publish. WordPress adds the link tags for you.
With a block theme, open the Site Editor, select the Site Logo block, and turn on Use as site icon.
How To Add a Favicon in Google Sites
If your website is built with Google Sites, you don’t need any code. Open your site in the Google Sites editor, click the Settings (gear) icon, choose Brand images, and upload your image under Favicon. Then publish your site.
How To Change Favicon?
When your favicon does not show in Google search results, or you want to change it for some other reason, follow these steps:
- Upload the new favicon, replacing the existing image, and update the link tag if the file name changed (or follow the instructions above for WordPress websites).
- If you use a caching plugin or service like Cloudflare, clear the cache so the new image is served.
- Go to Google Search Console and use the URL Inspection tool to request reindexing of your home page.
Google says recrawling can take anywhere from several days to several weeks. The browser tab icon usually updates as soon as you clear your browser cache.
Why Is Google Not Showing My Favicon?
When there is an issue with your favicon, Google will show a default icon in the search results. You can use the following tips to troubleshoot and find the possible reason:
- Open your favicon URL (for example, https://www.example.com/favicon.ico) in a browser to check that it loads, is square, and is at least 8x8 pixels (ideally larger than 48x48).
- Check that it’s in a supported format: BMP, GIF, ICO, PNG, JPEG, PPM, or TIFF.
- View your home page’s source code and search for
rel="icon". The tag should be in the<head>section and point to the right URL. - Make sure the image follows Google’s guidelines. Icons with inappropriate imagery, such as hate symbols, are replaced with a default icon.
- Check that your robots.txt is not blocking Googlebot from crawling your home page or Googlebot-Image from crawling your favicon. Our technical SEO guide explains how to check this.
- If your favicon is in a subfolder site (like example.com/blog), remember that Google only uses the favicon of the main hostname.
- Clear your browser cache and check again, as sometimes old versions are stored. Check also using a Private Window (or Incognito).
Favicon FAQ
What size should a favicon be for Google?
Square and at least 8x8 pixels, but Google recommends larger than 48x48 pixels. A 512x512 pixel source image scaled down works well.
Can I use an SVG favicon?
Browsers support SVG favicons, but Google’s list of supported formats for search results doesn’t include SVG. To be safe, add a PNG or ICO version as well.
Why hasn’t my favicon changed in Google?
Google has to recrawl your home page first, which can take several days to several weeks. Request indexing in Search Console and keep the new favicon URL stable.
Does a favicon help SEO?
Not directly as a ranking factor, but a clear favicon makes your result easier to recognize in the search results, which can help you get more clicks. To learn the rest of SEO step by step, see our SEO Courses Bundle.
