How to Change the Color of Chrome Header Bar on Android with Divi
I’m sure you will agree with me that the example on the right looks much better because you can match the color of the header bar with your website’s color scheme. By matching the colors, you can achieve a better UX for your website.
Now, if you wonder how you can do this, read on. It is pretty simple. The only thing that you need to do is to add a line of custom CSS code to the Divi Theme Options in your WP admin panel.
So, to apply this trick, just add the following CSS code to Integration > Add code to the HEAD of your blog:
<meta name=”theme-color” content=”#8e8e8e” />
NOTE: Make sure that the “” characters in the shortcode are copied correctly and are not “” or ¨¨, because it may not work.
Don’t forget to replace the color code #8e8e8e with your desired color.
However, please note that this works on Chrome on Android smartphones only. It does not work on iPhones, nor in Safari or other browsers. But still, it is a nice feature to have.
I hope you will find this small tip helpful.
And you might also like to check out my other article on how to change the Divi accent color on one particular page.
WordPress expert. Divi user since 2014. I blog about WordPress and Divi, my favorite WordPress theme. When I’m not working with WordPress or writing an article for this blog, I’m probably learning Italian. You can read more about me here.