Update: Apparently it doesn’t work in the beta version of chrome. Thanks to /u/aurimas_chromium for reporting the bug. (crbug.com/482291) It also only works if you have the option “Merge Tabs and Apps” turned on. Thanks to /u/plastix3000

You maybe knew that you could set the color of the navigation bar in chrome on android by adding the following meta tag to your website:

<meta name="theme-color" content="#db5945">

But did you know that you can animate it?

If created a little demo on http://party.robinglauser.ch so you can test it on your android device. (Tip: Click on the disco ball for extra party effect :D)

Below is the main logic to animate the navigation:

var metaTag = $('meta[name="theme-color"]'); var body = $('body'); var hue = 0; function animate() { hue++; if (hue == 361) { hue = 0; } metaTag.attr("content", 'hsl(' + parseInt(hue) + ',100%,50%)'); body.css({"backgroundColor": 'hsl(' + parseInt(hue) + ',100%,50%)'}); } setInterval(animate, 16);