Menu

Favicon not updating after deploy? 5 fixes for the browser's favicon cache
📰

Favicon not updating after deploy? 5 fixes for the browser's favicon cache

DEV Community: html·Bharat Ankh·11 days ago
#RXo9g05D
#devto2#devto#dev#favicon#browser
Reading 0:00
15s threshold

You deployed a new favicon, hard-refreshed, and the tab still shows the old one. That is normal: browsers keep favicons in their own cache (Chrome, for example, stores them in a separate favicon database), so a page reload often doesn't re-fetch the icon.

Here are the fixes, roughly in the order worth trying.

1. Cache-bust the icon URL

<link rel= "icon" href= "/favicon.ico?v=2" sizes= "32x32" > <link rel= "icon" href= "/icon.svg?v=2" type= "image/svg+xml" > <link rel= "apple-touch-icon" href= "/apple-touch-icon.png?v=2" >

Enter fullscreen mode

Exit fullscreen mode

Bump v= every time the icon changes. A new URL is a new cache entry, so the browser has to fetch it.

2. Open the icon file directly

Visit https://yoursite.com/favicon.ico in a tab and hard-reload that tab (Cmd/Ctrl+Shift+R). That often replaces the cached copy faster than reloading the page. A fresh browser profile or a private window is the quickest way to check what new visitors see.

3.…

Continue reading — create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.