How to remove dark shadow from collection banner image?

Store Design
1

Hello,

I am trying to get rid of the black shadow that i am seeing on the colletion iamge banner.

Is there any way to make the images look like the original image file?

Here are the links to my website that has the black shadow on the banner image.

https://www.motowntress.com/collections/persian-remy-wig

https://www.motowntress.com/collections/hd-whole-lace-wigs

https://www.motowntress.com/collections/hd-13x5-lace-wig-1

Thank you

2

Hi @MotownTress !

This should be an option that can be altered from within the theme editor. Depending on the theme you are using, the position for this setting can change. If you are using the Dawn theme, or a new 2.0 theme, then you should be able to open the theme editor, select the section from the left hand side bar and then adjust the slider that appears in the section settings on the right hand side (see image below).

It is usually referred to as an image overlay. If you aren’t able to find that adjustment slider, let me know what theme you are using and I will try to have a look myself.

16-27-298-88173
16-27-298-881731919×528 88 KB

3

Hi @MotownTress

  1. Go to your Admin store > Online store > Themes > Click Actions > Edit code

  2. Open the theme.scss file under your Asset folder.

  3. Then paste code below.

.PageHeader__ImageWrapper.Image--contrast:after {
    background-image: none;
}
4

Hi @MotownTress ,

Go to Assets > theme.scss.liquid and paste this at the bottom of the file:

.template-collection .Image--contrast:after {
    opacity: 0 !important;
}