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!
Topic summary
Goal: Change the Dawn theme’s header/menu background to color #f6cbc6.
Suggested approaches:
- Theme Editor (no code): In Online Store > Customize, select Header and choose a Color scheme for the header and menu. Define/adjust schemes under Theme settings > Colors, then assign them to the Header. Screenshots show where to set the schemes and how header vs. menu backgrounds are controlled.
- CSS in code editor: Open base.css and append custom rules to set the background (examples provided target sticky-header or header wrapper) using background-color: #f6cbc6 (some include !important). A step-by-step screenshot illustrates editing base.css and the resulting pink header.
- Assistance offers: Requests to share store URL and password (if enabled) for tailored help.
Latest development: A new user asks how to highlight only one specific menu item (e.g., “Xmas 2025”) rather than all menu items. No solution posted yet.
Status: Multiple viable methods shared; no confirmed resolution from the original poster. The single-menu-item highlight question remains unanswered. Images are central to the UI steps and expected visual outcome.
Add this css in your edit code > base.css file
sticky-header.header-wrapper {
background-color: #f6cbc6;
}
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.
Hi @Greggy55 ,
Let try insert below code at the end of file base.css
sticky-header {
background-color: #f6cbc6;
}
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.
- 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.
