Favicon Fun - Dynamically Updating Your Site Icon with ReactJS

github logo ・1 min read

Want to make your website or app standout? One way could be what I cover in the video below, using Javascript to dynamically edit your website's favicon based on the state of your application.

How can I use this

The most obvious is to notify users of interactions on your site. For example, if you have a chat app, you could dynamically adjust the favicon to show users they have a message waiting even if they are in another tab.

A more advanced example would be swapping through an array of images to create an animation effect similar to a gif. I will be covering that in a future tutorial so be sure to subscribe

twitter logo DISCUSS (3)
markdown guide

This was real fun to watch as favicon is the "face" of the web page.


Glad you enjoyed it, I've seen a few websites do stuff with their favicons so I looked further into it and figured some other people might be interested as well


I was surely interested and thank you for sharing~

Classic DEV Post from Apr 4

What's an awesome VS Code extension you recently installed?

I just came across a simple yet awesome VS Code extension tonight care of Elija...

Renaissance Troll profile image
The renaissance man is dead, long live the renaissance troll