How to remove background color where image banner resides? Dawn theme version 11

Technical Q&A
, ,

Topic summary

A user needed to change the background color of an image banner section to white in Shopify’s Dawn theme version 11, as adjusting the color scheme settings had no effect.

Solution provided:

  • Navigate to Shopify admin → Online Store → Themes → Actions → Edit code
  • Locate the CSS file (base.css, style.css, or theme.css) in the Assets folder
  • Add the following CSS code at the bottom:
.banner__media.media.scroll-trigger.animate--fade-in { background: white !important; }

Outcome:
The user successfully applied the custom CSS code and confirmed it resolved the issue. The solution uses the !important flag to override existing background color styles on the banner media element.

Summarized with AI on November 18. AI used: claude-sonnet-4-5-20250929.
1

How to remove background color where image banner resides? Dawn theme version 11.

I want it to be white. Changing color scheme has no effect.

daved1234_0-1691175178845.png
daved1234_0-1691175178845.png1213Ă—487 447 KB

daved1234_1-1691175242498.png
daved1234_1-1691175242498.png1206Ă—485 492 KB

My site:
https://ec6bc3-2.myshopify.com/
PW
eawhup

1 Like
2

Hi @daved1234 ,

Try this.

  1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  3. In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
  4. And Save.
.banner__media.media.scroll-trigger.animate--fade-in {background:white !important;}

Result:

Ribe_Dagandara_1-1691176979875.png
Ribe_Dagandara_1-1691176979875.png1328Ă—490 174 KB

I hope it help.

3

Thank you!

I added your code to custom CSS and it worked!