Dawn Theme - Removing Color Scheme in Image Banner / Product Image Slider

Topic summary

Main issue: removing the Dawn theme’s Image Banner background color and setting up a product image slider on product pages.

Resolution for background: Adding a CSS rule in base.css to make banner boxes transparent (.banner__box.color-background-1 and .banner__box.color-accent-1 set to background: transparent !important) solved the original request. The requester confirmed it worked for both black and white banner backgrounds.

Product slider: A guide link was provided to implement a product slider in the Dawn theme (external tutorial). No confirmation of implementation outcomes was posted.

New issues:

  • A user reports a persistent grey gradient in the Image Banner even with “Image overlay opacity” at 0%. The helper requested the store URL; no further update yet.
  • Another user says the transparency fix works but wants the banner text to remain white; the button follows accent color, but text turns black. No solution posted.

Status: Original background-removal request resolved. Product slider guidance provided. Subsequent grey overlay and text color concerns remain open.

Context: Images were shared to illustrate the banner background and desired slider layout. Terms: “Image Banner” is a theme section; “Image overlay opacity” controls the overlay’s transparency.

Summarized with AI on February 9. AI used: gpt-5.

Hello,

How can I remove the color scheme / color background of my Image Banners?

For example, I would like to remove the black color background in that Image Banner. That feature is not available in the color schemes options

On the other hand, is there a way to change the way my product detail page images are listed? I would like to see the pictures of my products laid out in a image slider gallery, such as:

Shopify: https://tridensusa.myshopify.com/

Thanks in advance

1 Like

@CAsupport

sorry for that issue

how can i check bcz your store is password protect

Hello there!

I am sorry about that, pw is gienim

I would also love to know how to remove the white background on this image banner

Thanks in advance :slightly_smiling_face:

1 Like

@CAsupport

thanks for more details yes please try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/base.css ->paste below code at the bottom of the file.
.banner__box.color-background-1, .banner__box.color-accent-1 {
    background: transparent !important;
}

also if you need product slider flow this all step if any issue let me know

https://made4uo.com/blogs/dawn-theme-tweaks-and-trick/product-slider-for-dawn-theme

1 Like

Hey! Just what I needed. Thanks a lot @KetanKumar

1 Like

@CAsupport

its my pleasure to help us

Hi Katan,

The background gradient color of the Image Banner is grey, I tried to reduce the

“Image overlay opacity” to 0%
but still, the background color is more greyish! Need help Please
Thanks!

2 Likes

@meo_me

oh sorry for that issue can you please send store url

hello your code works perfect but i would like to keep the banner text white , the button change to my accent 1 but i dont like the text black , thank you very much