Change Browser Address Bar Color on Mobile


Hi!

Does anyone know how can I add color to the browser address bar on mobile? I’m talking about this:

Thanks!


2 replies

Userlevel 5

So I’ve played around with this a bit and found it to be unreliable. I don’t think this works on all devices and/or all the time. Usually Google Chrome on Android devices works the most, so I guess 1/3 is good right 😉

But below is an example that covers android, iOS, and Windows phones. You can add in the Javascripts tab of your page and use the Head Placement:

<meta name="theme-color" content="purple" />

<meta name="apple-mobile-web-app-status-bar-style" content="purple" />

<meta name="msapplication-navbutton-color" content="purple" />

Oh and if you want to change the color just use what you need in between the “…” after content. content=“blue” or content="#0098DB

Enjoy!

Thanks! it worked perfectly 🙂

Reply