Remove banner overlay

Store Design
, , ,

Topic summary

A user seeks help removing a dark overlay from their homepage banner image, which appears dimmer than the original bright image.

Solution Provided:

  • Access the theme code editor (Online Store → Edit Code)
  • Locate the theme.liquid file
  • Insert custom CSS code above the </body> tag

The CSS targets the banner overlay element and adjusts its opacity to remove or reduce the darkening effect. A before/after screenshot demonstrates the overlay successfully removed, showing the brighter original image.

Status: Resolved with working code solution.

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

Can anyone help me remove the dark overlay here? my image is much brighter than this
On my homepage . https://correl8ted-inc.myshopify.com/

Thank you!!

Daniel19901_0-1736007567618.png
Daniel19901_0-1736007567618.png1905×804 250 KB

1 Like
2

Hey @Daniel19901

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1736009135441.png
Moeed_0-1736009135441.png1893×856 281 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

1 Like