Header – Banner Background Block – Color Change

  • Author
  • #101583


    Good day, WordPress team. Scottrrollo helped me with my previous query and this has prompted me to ask for help again. Question;
    1: Is it possible to change the background color of the Header – banner block with custom CSS, the block where the header image is displayed?
    If I “right click” and inspect the element, hovering over the [header role=”banner”] line the block is shown. I would like to have the option of trying out different colors for this specific area.
    Hope you can help.

    The blog I need help with is derekevens.wordpress.com.


    Theme Author

    Hey again, Derek! I hope you’re doing well.

    It should be as easy as this:

    header[role="banner"] {
        background: #1B67E0;

    Feel free to change the color value of #1B67E0 to your liking. You may also find it helpful to use this color picker.

    Let us know how you go.



    Worked like a charm, thanks scottrrollo. Hope to get some of my own CSS under the belt soon, busy doing some reading and with your help understanding a bit more now. Have a good day!



    With the help this forum has given me, I am able to enhance my limited knowledge of CSS HTML coding. I did the first bit on my own CSS by looking at what had been given me by scottrrollo and applied it to another part of my blog/site and it worked! Thanks “The WordPress Team”


    Theme Author

    That’s so great to hear, Derek! Nice work 👍

The topic ‘Header – Banner Background Block – Color Change’ is closed to new replies.