Animating favicons with Canvas and JavaScript

In my previous article I played with animating the browser tab title using document.title . The natural follow-up: can you animate the favicon too? Yes. The trick is drawing to a hidden <canvas> , converting it to a data URL, and assigning it to the favicon's href . Inspired by this CSS-Tricks article by Giulio Mainardi, here are three variations. Square loader Progress pie Notification pulse…