Nowadays it’s important to make website’s mobile friendly because around 65% of users browsing websites are from mobiles. In this tutorial we will be showing you how to change the address bar area color matching the website. For matching the address bar and the website what we have to do is just add the below code to your HTML page inside the head session .

(i.e) Inside <head>

Below is the code which needs to be added to the head session. Replace “Your color code” with your color code (i.e) #000

<meta name="theme-color" content="Your color code">

The perfect example is below.

<!-- Chrome, Firefox OS and Opera -->
<meta name="theme-color" content="#4285f4">
<!-- Windows Phone -->
<meta name="msapplication-navbutton-color" content="#4285f4">
<!-- iOS Safari -->
<meta name="apple-mobile-web-app-status-bar-style" content="#4285f4">

Hope this tutorial help you. If you have any doubts you can place a comment. Happy blogging.

Leave a Reply

Your email address will not be published. Required fields are marked *