Chrome Android address bar color: a step by step guide

Development
Chrome Android address bar color: a step by step guide

Ever wanted to make the experience for your mobile users more personal and branded? Have you ever noticed how the Chrome Android address bar color sometimes changes to match a site’s palette? Do you want that for your site?

It’s easy to do. To let your users experience the color of your brand, blog or e-commerce site in a much more personal way on Android, all you need is a simple HTML change. Add a meta tag in the head of your page:

<head>
  ...
  <meta name="theme-color" content="#2ac5ee">
  ...
</head>

Naturally, #2ac5ee is Blu Frame‘s color, and you need to change that with any HEX color you want to paint the address bar with.

And the final result? Here is our home page on a Samsung Galaxy Note 4 before we colored the address bar:

android-bar-standard

As you can see, everything about the address bar looks standard and dull: white background with a grey border. Almost every site will appear like that, and it’s safe to say it doesn’t stand out.

And here is our new Inspire by Blu Frame home page, colored to match our brand:

android-bar-color

The address bar now matches our brand colors, and we feel that the experience for our Android users on Chrome is more personal and ties in with all the navigation elements of the site.

If you’re not on one already, open this page again on any Android smartphone or tablet and see what it actually looks like.

And remember: all you need is that a simple meta tag and you’ll see you’ll be able to match the Chrome address bar to your site’s colors straight away!

Edoardo L'Astorina

Edoardo L'Astorina

Edoardo L'Astorina has 8 years of experience in software development. He has had a major role in the new Transport for London site and has developed sites and apps for JPC, The Crocodile and Miura. Edoardo started Blu Frame to help companies develop sites that stand out, load fast and are easy for users to access. Edoardo is passionate about risotto, Terrence Malick movies, Oasis songs and rowing. Edoardo is the founder of Blu Frame.