Google Chrome has rolled out a new feature in its mobile version which allows you to change the color of header bar and address bar on your website or blog.
It gives app-like experience on the web and makes your website more user friendly. You can see the live preview of this feature by visiting our website in the mobile version of Google Chrome.
It’s very easy to implement this feature into your website or blog. You just need to add a one line of code in the head section of your website. This guide will show you how to change the Google Chrome tab color of your Blogger blog.
Change Google Chrome Tab Color of Your Blogger Blog
You can change Google Chrome tab color by adding a new meta tag into the head section of your website with name=”theme-color” and its content set to any valid CSS color code. For example –
<meta name="theme-color" content="#db5945">
Here’s a step-by-step guide to add this code in your Blogger website –
- First, open your Blogger dashboard and go to Template > Edit HTML.
- Now click anywhere in the template editor and press CTRL+L key to open the search box.
- Type the <head> tag and press enter button to search it.
- Just below the <head> tag, add the following code:
<meta name="theme-color" content="#db5945">
Replace #db5945 with your own hex color code. You can use this HTML Color Picker by W3Schools to generate the color code of your favorite color.
If you want to pick a color from a web page, you can use a Google Chrome extension like ColorZilla. Make sure to match the theme color with the color of your Blogger website. - Finally, click “Save template” to save the changes. That’s it.
Now open your website or blog in the mobile version of Google Chrome and see how it looks. If you want to ask something about this tutorial, feel free to share it in the comment section.
Vivek ChaudharyVerified AuthorThis author is verified as a trusted expert and senior writer. A formal process has been completed to confirm their identity and qualifications.
