How do I force a favicon refresh?

Solution 1:

To refresh your site's favicon you can force browsers to download a new version using the link tag and a query string on your filename.
This is especially helpful in production environments to make sure your users get the update.

<link rel="icon" href="http://www.yoursite.com/favicon.ico?v=2" />

Solution 2:

Adapted from lineofbird's answer beloew, you can do the following:

1. Go directly to the favicon url in the address bar by typing in it's address e.g.

   • www.yoursite.com/favicon.ico
   • www.yoursite.com/apple-touch-icon.png
   • etc.

2. Navigate to the url by pressing Enter

3. Refresh with Ctrl+F5

4. Restart your browser (e.g. Chrome, Firefox)

Solution 3:

This answer has not been given yet so I thought I'd post it. I looked all around the web, and didn't find a good answer for testing favicons in local development.

In current version of chrome (on OSX) if you do the following you will get an instant favicon refresh:

1. Hover over tab
2. Right Click
3. Select reload
4. Your favicon should now be refreshed

This is the easiest way I've found to refresh the favicon locally.