Change Blogger Header background color

To change the background color of the Header, first determine what color you would like to have. You may look at the HTML Color Chart for the colors you can experiment with. For example, if you have decided on a color code #B38481, go to Template and click “Edit HTML”. Scroll to the part where you see this:-

#header-wrapper { width:660px; margin:0 auto 10px; border:1px solid $bordercolor;

Add right after this an extra line:-

background:#B38481;

Save the template and refresh your Blog site. You may have to change the Header and description font colors. Simply go back to the “Fonts and Colors” tab, and change them accordingly.



Note that in different templates, instead of #header-wrapper, you may see #header-wrap or #header or #head. Try to insert the color code and preview the change. If there is a background color, you've probably got it right.

You may also read the related article to have a Background Image for Blogger Header.

Posted in: Blogging Tips