How to Change Address Bar Color for your Website

address bar color


Have you ever noticed that the Website like Facebook, Instagram, Flipkart, Airtel, and others have their own Address Bar Color?

Day by Day, The New version of Browsers have to come up with more customization. The customization contains features like customization of Address Bar color, icons, colored selector and many things. These simple things can increase your site looks, more compelling toward your Brand and can increase your site engagement and bring your users back.

These features were available only on Android 5.0 Lolipop or above with Chrome 39 or above. These features make a better experience for your web site on Browsers in Smartphones.

You must have seen that the Brand color of a web site always matches to their address bar color. Using the theme for address’s bar with matching your brand color will improve the user experience. It also helps to your users to keep in mind your brand color.

Note: It may be not working on all browsers, but in Chrome, it perfectly works and can significantly enhance the user experience.

Let’s see How to change the address bar color or Toolbar color of browsers in Smartphone.


How to Change the Color of Address bar of Mobile Browsers

To modify the address bar color, You have to add the <meta> tag to your website. Add a <meta> tag with “theme-color” and a CSS color code as your desired brand color in content.

<meta name="theme-color" content="#ff6a00" />

If you want to change the color of the address bar for your website, It should be sum up on every page of your site or the main index page.

If you want to change the color of the address bar for your WordPress Blog, It must be added on the Theme Header (header.php) page in Appearance>>Editor>>Theme Header in between the <head> Tag.

If you added this code to your Blog or Website, then share your experience in the comment.


  1. Erin Thornton says:

    I’m not technology friendly, but this seems easy enough to work through.

  2. Tina says:

    I really had no idea it was so easy to do! I have to bookmark this and try it out for my site, I agree it could make a big difference 🙂 Thank you for sharing this tip!

    • Ashutosh Singh says:

      Yes, it is very easy don’t need of any knowledge of HTML or CSS. You can add this script easily.
      Thank you for stopping here and comment.
      Have a good day!

  3. Dominika says:

    Wow! Educative post. I didn’t even notice this address bar color of a thing. I’m heading to change mine

    • Ashutosh Singh says:

      Thank you!
      Yes, this address bar colour can increase your website looks and also improve user experience.

  4. Loved reading your article Good work.

  5. Wow. thanks for heads up. Please send the link in my email so I can use these tips in future.

  6. ofyi says:

    The language is so simple for bloggers to understand. Thanks for the insight!

  7. Jimmy says:

    Nice technology Article. Love to read it.

  8. Nice information. Great learn, easily explained the way of doing such stuffs…

    Thanks for sharing ! Keep Sharing !!

  9. Janvi says:


  10. Suraj says:

    I will try it on my site…

  11. Mehwish Noor says:

    This is very helpfull article for me . Thank You So much Admin For Share This With Me .

  12. Sajad Aslam says:

    Valuable information, thanks for sharing.

  13. Hi Dear,
    Your article is very attractive and helpful keep it up.
    Thanks to share us.

  14. stephanie says:

    Interesting! I homestly haven’t noticed certain sites have color address bars, that being said, customization is always good. I’m a MAC girl but it sounds like this works on Chrome regardless. Thanks for the info and tutorial 🙂

  15. Lucinda says:

    Really useful and informative, thank you!

  16. Cool stuff. Thank You for sharing.

  17. raman says:

    Hi Ashutosh,
    I am read this article . article is very good
    thank you

  18. Palashtd says:

    Excellent tip. But have you tried ever?

    • Ashutosh Singh says:

      Thank you Palashtd for stopping here and commenting.
      Yeah, I am tried this you can see this by browsing shouterworld in your chrome browser in Mobile.

  19. Rahul Mane says:

    Keep it up.. Nice Work

  20. thanks man, i changed my site address bar color.
    Keep posting

  21. Sam says:

    Wow… That’s an informative article. Please keep writing for us.

  22. Very nice a great job i liked the article the way it’s written

  23. akki thakur says:

    nice and very informatic article bro please write an article on how can we get free push up notificaction bar for blogger

  24. Keep it up.. Nice Work

  25. Hi Ashutosh

    really helpful. Thanks for the information

  26. Travantela says:

    this is nice article.
    keepup with good work. thanks for sharing…

  27. Farhan Khan says:

    Hi Dear,
    Your article is very attractive and helpful keep it up.
    Thanks you.

  28. kajal dutta says:

    nice article thanks for share

  29. james says:

    Hi Nice Article,
    Thanks for sharing. keep up the good work.

  30. Honey Tahir says:

    Hi, very good article.
    Thanks for sharing, keep up the good work.

  31. Ching says:

    That was good info. I’m going to try this

  32. Jordyn says:

    Such useful tips for the technology handicapped like myself!

Leave a Reply

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