You open your website and the browser tab shows a blank page, a globe, or your website builder's logo. Then you search your business name and a generic globe sits beside your result. It looks unfinished, and it is easy to fix. A favicon is the small square icon that appears in browser tabs, bookmarks and sometimes in Google Search. To add a favicon to your website, prepare a simple square image, upload it through your platform's own favicon control, publish the site, and check the live page rather than the editor preview. The Google part runs on its own schedule, so this post also gives you the checks to run when your tab icon works and the Google result still shows a globe. The upload itself is a few minutes of work you can do yourself.
Key Takeaways
Prepare a simple square image, and upload it through your platform's favicon control, not through a plugin pile or a hand-edited file.
The editor preview can show an icon the public site does not have yet, so check the live tab in a fresh browser window.
The home page and the favicon file must be crawlable, the URL should stay stable, and Google keeps one favicon per hostname.
Google says a favicon may not appear even when every guideline is met, so fix what you control and request indexing of your home page.
Prepare one simple square image first
Everything else is easier when the image is right, so spend your time here. A favicon shows at tiny sizes, so a simple symbol, an initial or the recognizable part of your logo usually reads better than a full logo with small text. At 16 by 16 pixels, detail turns into noise. If your logo is a long wordmark, pick the mark, the first letter or a simplified shape from it.
The image has to be square. Google's favicon guidelines, updated February 4, 2026, require a 1:1 aspect ratio and a size of at least 8 by 8 pixels, and recommend one larger than 48 by 48 pixels so it looks good across different surfaces. A square PNG at 512 by 512 pixels covers every platform below, and you can shrink it from there if a platform asks for less.
Each platform adds its own rules on top of Google's. WordPress asks for a square image of at least 512 by 512 pixels, and recommends PNG, in its favicon documentation. Squarespace recommends a PNG between 100 by 100 and 300 by 300 pixels and under 100 KB, on its favicon help page. Wix recommends a multiple of 48 pixels unless you use SVG, per its favicon article. That multiple-of-48 note is Wix and Squarespace guidance for their own tools. Google's minimum is 8 by 8, and its recommendation is larger than 48 by 48.
Upload it where your platform keeps the favicon setting
Every platform has one place for this. Use it, publish, and you are done with the browser tab. Menu names and plan rules change, so confirm the labels in your own account.
WordPress
On WordPress 6.5 and later, upload a square image of at least 512 by 512 pixels, open General Settings, choose Site Icon, and select the image. WordPress recommends PNG. The site icon function reference explains how the icon is added to your pages. Skip the favicon plugin if the built-in Site Icon works.
Wix
In Wix, open Settings, then Website settings, then choose Upload Image under Favicon. Wix requires a Premium plan and a connected domain for this. If your site is still on a free Wix address, the icon will not take until you upgrade and connect your domain.
Squarespace
In Squarespace, open the Favicon panel, upload the image, optionally add a dark-mode version, and save. Keep the PNG between 100 by 100 and 300 by 300 pixels and under 100 KB.
Shopify
In Shopify, go to Online Store, then Edit theme, then Theme settings, then Logo or Favicon, select the image and save. Shopify's favicon instructions list the supported plans as Basic or higher.
After you save, publish the site. An unpublished change is a common reason an icon seems not to work. Then open your public address in a fresh browser window and look at the tab.
A custom-coded site points to the file with one link tag
If your site is hand-coded, the favicon is one line in the head of your home page: a link tag with `rel="icon"` and an `href` pointing to your image. MDN documents this in its link element reference and lists ICO, PNG and GIF as common formats. You do not need an ICO file, and the file does not have to be named favicon.ico. PNG works, and the link tag can point at any path you choose.
Google accepts several image formats for Search, including PNG, ICO, GIF, JPEG, BMP, PPM and TIFF. SVG is useful in some browsers, but it is not among the formats Google lists for Search, so keep a PNG or ICO as the fallback. The `apple-touch-icon`, usually a 180 by 180 pixel PNG, is meant for iOS home-screen bookmarks. It is not what Google Search reads.
One rule matters more than the format. Pick a path and keep it. Google says the favicon URL should stay stable, so renaming or moving the file every few weeks works against you.
Check the live tab before you look at Google
Your tab and Google are controlled by different systems, so check them separately. Do the browser check first. It tells you whether the upload worked.
- Open your live site in a private browser window and look at the tab.
- Open the favicon address directly. It should load as an image with no error.
- View the home page source and look for a link tag with `rel="icon"`, or the platform's equivalent.
- Confirm the icon is square and meets your platform's size rules.
If the tab still shows the old icon, the browser may be holding a stored copy. Clear the site's stored data, restart the browser, and test another browser or your phone. Also confirm you are looking at the public domain and not a builder preview, since previews can show a different icon from the live site.
Google needs to crawl your home page and your favicon
Once the tab is right, turn to Google. Google's guidelines say Googlebot-Image must be able to crawl the favicon file and Googlebot must be able to crawl the home page. Google supports one favicon per hostname, so a favicon set up for a subdirectory will not be used on its own. The icon must be linked from your home page.
Run these checks in order:
- Open /robots.txt on your site and confirm it does not block the favicon path or the home page.
- Open the favicon URL and confirm it loads without redirecting to a broken page.
- Confirm the image is square and larger than 48 by 48 pixels.
- Confirm the URL has not changed repeatedly, and that you use one public hostname.
- In Search Console, use URL Inspection to request indexing of your home page.
Then wait. Google says crawling can take several days to several weeks, depending on its refresh decisions. A browser can show your new icon while Google keeps showing an older or default one until it recrawls and processes the change.
Google also states: "A favicon isn't guaranteed to appear in Google Search results, even if all guidelines are met." So a missing Google icon does not mean your site is unindexed or penalized. Fix what you control, request indexing, and leave the favicon URL alone while you wait. If your home page itself is missing from Google, our post on a page that is not indexed in Search Console walks through that separately.
| What you see | Likely cause | What to do |
|---|---|---|
| Builder logo or blank icon in the tab | No favicon was uploaded, so the platform shows its default | Upload a square image in the platform's favicon setting |
| Old icon in the tab, new one in the editor | Change not published, or browser cache | Publish, clear site data, test another browser |
| Icon in the tab but a globe in Google | Google has not recrawled, or has chosen not to show it | Check crawl access and the URL, request indexing, wait |
| Icon works, then breaks after a move | New domain, hostname or favicon URL | Standardize one public hostname and one favicon URL |
A logo that does not shrink is the usual reason to bring in help
A simple upload does not need a developer or a redesign. You can finish it in minutes through your platform. Help becomes reasonable when the task is bigger than uploading an image:
- You have no usable mark, or your logo is too detailed to read at small sizes.
- Your site is custom-coded and the link tags conflict or point to a missing file.
- You are moving to a new domain or platform and need one favicon URL on one hostname.
- You cannot reach the site settings, or you inherited the site from someone else.
- You want robots.txt, redirects, caching and Search Console checked together.
In those cases you are paying for a small-size version of your mark, correct files, a tested live page and a record of what changed. You are not paying for a guaranteed Google result, because nobody can promise one. If your brand has no written rules for its mark yet, our post on brand guidelines for a small business shows what to settle first.
Will your favicon show up?
Pick an answer to begin.
1. What is the minimum favicon size Google lists for Search?
2. Your favicon shows in your browser tab but Google still shows a globe. What should you do?
3. Does your favicon have to be named favicon.ico?
Frequently Asked Questions About add favicon to website
What is a favicon?
A favicon is the small icon shown with a website in browser tabs, bookmarks and other places, including Google Search results when Google chooses to show it.
What size should a favicon be?
Google requires at least 8 by 8 pixels and recommends larger than 48 by 48. WordPress asks for at least 512 by 512 for its Site Icon, and Squarespace recommends a PNG between 100 and 300 pixels.
Does a favicon have to be an ICO file?
No. PNG is widely supported, and your page can point to the icon with a link tag that uses `rel="icon"`.
Why is my favicon not showing in Google?
Check that the home page and favicon are crawlable, the image is square, the URL is stable and the favicon is linked from your home page. Then request indexing. Google does not guarantee display.
How do I add a favicon in WordPress?
Open General Settings, choose Site Icon, and upload a square image of at least 512 by 512 pixels.
How do I add a favicon in Shopify?
Open Online Store, Edit theme, Theme settings, then Logo or Favicon, select the image and save.
Moving Forward
A favicon works once you have a simple square image, an upload through your platform's own control, a published site and a check of the live tab. Google adds its own conditions: a crawlable home page and favicon file, a stable URL, and one favicon per hostname. Even then, Google decides whether to display it.
Do the browser check today, and the Google check next to it. Once the tab shows your icon, the remaining wait belongs to Google, and the one thing left for you to do is leave the favicon URL alone.
If you would rather have it done and tested, Web Leveling can prepare a small-size version of your mark, add it to your site, and check the live page and crawl access as part of our web design work. If your platform's upload field does the job, we will tell you to use it. We work with small and medium businesses across the country and overseas. Send us your site address and logo, and we will tell you what needs changing.
Terms
Favicon words in this post
Tap a term to see what it means.
Favicon. The small square icon shown with a website in browser tabs, bookmarks and sometimes Google Search.
Site Icon. WordPress's name for the setting that holds your favicon.
Apple touch icon. A PNG, usually 180 by 180 pixels, used for iOS home-screen bookmarks.
Hostname. The address part of a site, such as www.example.com. Google uses one favicon per hostname.
Crawl. When Google's bots fetch a page or file so they can process it.
URL Inspection. A Search Console tool that shows how Google sees a page and lets you request indexing.
