Change Chrome tab color with JavaScript or jQuery

Sir_baaron picture Sir_baaron · Aug 28, 2015 · Viewed 11.8k times · Source

In Chrome you can set the color of a tab with the meta tag:

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

In my website, I have several sections color-coded. To make it look better, I would like to dynamically change the tab's color according to the currently opened section. I have tried doing it with jQuery:

$("meta[name='theme-color']").attr('content', '#455A64');

But it doesn't work. I would be very glad if someone can tell me if/how you can change this meta value during runtime.

Edit: After some checks I noticed that the code does change the meta tag content, but Chrome doesn't update the tab color.

Answer

WyriHaximus picture WyriHaximus · Feb 13, 2018

For this who land on this page from Google looking for a vanilla JS solution:

document.querySelector('meta[name="theme-color"]').setAttribute('content',  '#123456');