How to change header / menu background color

[Greggy55]

Hello everyone, 

I am using dawn theme. 

I want the background of my menu or my header where my menu sits to be this color : f6cbc6

How would I do this? 

Thanks!

[Raj-webdesigner · Accepted solution]

Add this css in your edit code > base.css file

sticky-header.header-wrapper {
    background-color: #f6cbc6;
}

[BSSCommerce-TC · Accepted solution]

Hi @Greggy55 ,

Let try insert below code at the end of file base.css

sticky-header {
    background-color: #f6cbc6;
}

[Raj-webdesigner · Accepted solution]

Add this css in your edit code > base.css file

sticky-header.header-wrapper {
    background-color: #f6cbc6;
}

[Rhen]

Hi, I have a similar concern but I would like to highlight one menu only, not all. how can I do that? Please see below Image just want to highlight red the menu "Xmas 2025"

[Moeed]

Hey @Greggy55 

Share your store url and password if enabled.

Best Regards,

Moeed

[lynth]

Go to the online store and click the customization button. There click on the header and change the color schema settings. You can also edit it using CSS in the code editor (three dots next to the customization button), then find the CSS file and your custom styles. If you share your url with me I can help you with custom modification.

[BSSCommerce-TC · Accepted solution]

Hi @Greggy55 ,

Let try insert below code at the end of file base.css

sticky-header {
    background-color: #f6cbc6;
}

[Saba13]

Hi

Kindly navigate to your theme editor > Header and scroll down to the color section:

You can select any scheme for your header and menu. The first changes the header background and the second one changes the menu background.

To change the schemes, you can navigate to your theme settings in the theme editor and go to 'Colors'. Here you can choose colors for your schemes and then assign them to sections in your theme.

[BSS-TekLabs · Accepted solution]

- Here is the solution for you @Greggy55 
- Please follow these steps:

- Then find the base.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

 

sticky-header {
    background: #f6cbc6 !important;
}

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.