Free tools Windows power users keep installed
One-click scans. No signup required.
To change the icon on a browser tab, create a square PNG, GIF, or ICO file, upload it to a publicly reachable, stable URL, and place a <link rel="icon"> element in your page’s <head>:
<link rel="icon" href="/images/favicon.png" type="image/png">Publish the page, then inspect the rendered HTML and open the page in a browser. A root-level /favicon.ico may be discovered automatically, but an explicit link is clearer and works when the file is stored elsewhere.
What a favicon does
A favicon (short for “favorite icon”) is the small image associated with a website or page. Browsers commonly show it in tabs and bookmarks. Search engines may also show a site icon beside a result, but that search display is controlled by the search engine and can take longer than the browser update.
The icon belongs in the document head, not in the visible page body. On a static site, add it to every HTML page or to the shared layout that generates those pages. In a framework, edit the layout or head component that is actually rendered in the final HTML.
Quick wins for a faster PC:
Repair Windows errors before they cause bigger problemsFix Now →Scan for outdated or missing drivers - takes under a minuteDriver Scan →#1 Best Overall
Change the favicon on a custom HTML site
1. Prepare a suitable image
- Use a square PNG, GIF, or ICO file.
- Favicons are often displayed at 16 × 16 pixels, so simple shapes and strong contrast remain readable when reduced.
- If a platform asks for a larger source image, use that platform’s requirement. WordPress’s Site Icon workflow, for example, recommends a square image at least 512 × 512 pixels.
- Choose a filename you can keep permanently, such as
favicon.png. A stable URL is important, particularly for search indexing.
2. Put the file in a public directory
Copy the file into a directory served by your website, for example:
/images/favicon.pngOpen that exact URL directly in a browser. It should return the image rather than a 404 page, login screen, HTML document, or access-denied response. If your site uses a content-delivery or static-file build step, confirm that the file is included in the published output.
3. Add the link in the rendered head
Place this element between <head> and </head>:
<link rel="icon" href="/images/favicon.png" type="image/png">The leading slash makes the path relative to the domain root. If the file is beside the current HTML file instead, use a relative path such as icons/favicon.png. An absolute URL also works when it points to the publicly served image:
<link rel="icon" href="https://www.example.com/images/favicon.png" type="image/png">Use the URL that will remain valid after future deployments. Google Search Central specifically advises that “The favicon URL must be stable (don’t change the URL frequently).”
4. Publish and verify
- Deploy the changed HTML and image.
- View the page source or the DOM inspector and confirm that the
rel="icon"element appears in the rendered<head>. - Open the
hrefURL directly and confirm that it returns the intended image. - Check the browser tab in a normal window and, if needed, a private window or a second browser. A tab update can lag behind a file upload because browsers cache resources.
Using more than one icon
You can provide alternatives with metadata hints. For example:
<link rel="icon" href="/icons/favicon-16.png" type="image/png" sizes="16x16">
<link rel="icon" href="/icons/favicon-32.png" type="image/png" sizes="32x32">Browsers use the available links and their type, sizes, and media hints when selecting an icon. Remove obsolete links rather than leaving several competing declarations with contradictory metadata.
Change a favicon in WordPress
WordPress.org (WordPress 6.5 and later)
- Sign in to the WordPress administration area.
- Go to Settings → General Settings.
- Choose Choose a Site Icon.
- Upload or select a square image. WordPress recommends at least 512 × 512 pixels and recommends PNG.
- Save the setting, then open the public site and inspect the browser tab.
WordPress inserts the required head markup for the site. If a theme or plugin also adds a favicon, inspect the rendered head for duplicate rel="icon" links and remove the competing declaration where possible.
WordPress.com
WordPress.com calls this the Site Icon. It is used for browser tabs, bookmarks, and potentially search results. On a block-theme site, change it from the Site Editor. The exact controls can vary with the active theme and WordPress.com interface, so verify the published page rather than relying only on the editor preview.
Rank #2
- Used Book in Good Condition
Change a favicon in Wix
Wix requires the site to be published, a Premium plan, and a connected domain before you can use a custom favicon. Set the favicon in the site’s Wix settings, publish the change, and then test the live domain. Wix notes that Google decides whether and when the icon is indexed or shown in search results; a correct Wix setting does not guarantee an immediate Google result icon.
Which implementation route should you use?
| Route | File and markup control | Ease of setup | Image-size guidance | Page-specific icons | Who controls search display |
|---|---|---|---|---|---|
| Custom HTML or framework | Full control over the file URL and <link> markup |
Requires editing and deploying the site | Use a square PNG, GIF, or ICO; 16 × 16 is a common display size | Yes, add the desired link in each page’s rendered head | The site owner controls markup; Google controls crawling and display |
| WordPress.org 6.5+ | Managed by the Site Icon setting | Upload through Settings → General Settings → Choose a Site Icon | Square image, at least 512 × 512 pixels recommended; PNG recommended | Normally site-wide through the Site Icon setting | WordPress outputs the markup; Google controls search display |
| WordPress.com | Managed through the Site Editor or site settings | No HTML editing required | Follow the uploader’s requirements | Generally site-wide | WordPress.com outputs the markup; Google controls search display |
| Wix | Managed through Wix settings | Requires a published site, Premium plan, and connected domain | Follow Wix’s uploader requirements | Configured at the site level | Wix and Google control how and when it appears |
Why the favicon is not showing
The image URL is wrong or inaccessible
Request the exact href URL in a new tab. Correct the path, filename, capitalization, or deployment location if it returns 404, redirects to a login page, or serves HTML instead of the image.
The link is not in the final head
Templates can contain a favicon declaration that never reaches the browser. Use the browser’s view-source or DOM tools on the live page and confirm that the element is inside the rendered <head>, not merely present in an unused template fragment.
Competing icon declarations exist
Search the head for every rel="icon" and historical rel="shortcut icon" entry. Remove stale declarations or make their type, sizes, and media hints intentional. Multiple links can cause a browser to choose a different file than the one you just uploaded.
PC Slower Than It Used to Be?
A free scan shows the junk files, broken settings and background clutter dragging Windows down - then fixes them in one click.Free scan · Windows 10 & 11Outdated Drivers Are Slowing You Down
One free scan finds every outdated or missing driver and matches the right update for your exact hardware.Free scan · exact hardware matchThe browser is displaying a cached result
Test in a private window or a different browser and verify the image URL independently. There is no single cache-clearing shortcut that behaves identically in every browser, so do not assume that one keyboard combination proves the deployment failed.
The image is unsuitable for the platform
Check that it is square and in a documented PNG, GIF, or ICO format. A CMS uploader may impose a larger minimum size even though the browser eventually displays the icon at a much smaller size.
You are checking Google too soon
A correct browser tab does not guarantee an immediate search-result icon. Google must recrawl the home page, fetch the stable favicon URL, and decide whether to show it. Wix likewise states that Google controls indexing and display.
Keeping the favicon reliable
- Keep the URL stable across deployments; replace the file at that URL when possible instead of renaming it repeatedly.
- Serve the image from the same public domain as the site unless you have a deliberate cross-domain setup.
- Keep the artwork simple enough to remain recognizable at tab size.
- Check every production template after a redesign, because a new theme or layout can remove the head element.
- For a multi-page site, verify representative pages, not only the home page, when the favicon link is generated by a shared layout.
Or skip the browser setup
If your goal is an automated page screenshot after publishing the favicon, ScreenshotNeo provides a single-request website screenshot API and an MCP server for AI agents. It captures the page itself, not the browser’s tab bar, so use a real browser to verify the tiny tab icon; use ScreenshotNeo for repeatable page-level checks and visual regression captures.
Before the capture, ScreenshotNeo can accept cookie or consent banners and remove more than 60 known consent platforms, newsletter popups, and chat widgets. Bot checks or CAPTCHAs, blank pages, timeouts, failed loads, and cache hits are not billed, and response headers identify the page verdict and billing status. Its MCP tools—take_screenshot, get_page_info, and capture_pdf—work with Claude, Cursor, and other MCP clients.
See the ScreenshotNeo API documentation for parameters and options. A one-call capture looks like this:
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://example.com -o shot.webpimport requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://example.com"}, timeout=90)
open("shot.webp", "wb").write(r.content)const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://example.com' }); const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);The Free plan includes 1,000 screenshots per month with no card. Paid plans start at $5 for 3,000 screenshots. Create a free ScreenshotNeo account when you want to automate those captures.
Frequently asked questions
Do I need both rel="icon" and rel="shortcut icon"?
No. rel="icon" is the standard declaration. Google also supports the historical rel="shortcut icon" form, but adding it is not necessary for a normal modern implementation.
Do these 3 things before closing this tab:
1Clear out junk files and repair common Windows errors2Scan for outdated or missing drivers - takes under a minute3Repair Windows errors before they cause bigger problemsCan the favicon URL be hosted on another domain?
The link can point to any publicly reachable image URL, but hosting it on the site’s own stable domain keeps deployment and access troubleshooting simpler.
Why does the browser tab update while the Google result does not?
They are separate systems. The browser reads the page and icon directly, while Google must recrawl the home page and choose whether to display the fetched icon.
Can I automate checks for the favicon?
You can automate retrieval of the icon URL and page screenshots. A screenshot API such as ScreenshotNeo checks page output, but browser-chrome elements such as the tab strip still require a browser-based test.
Frequently Asked Questions
Do I need both rel=”icon” and rel=”shortcut icon”?
No. rel=”icon” is the standard declaration. Google also supports the historical rel=”shortcut icon” form, but it is not required for a normal modern implementation.
Can the favicon URL be hosted on another domain?
It can point to any publicly reachable image URL, although a stable URL on the site’s own domain is usually simpler to deploy and troubleshoot.
Can I automate checks for a favicon?
You can automate retrieval of the icon URL and page screenshots, but browser tab chrome still requires a real browser-based test.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
