product page

Store Design
, , , , , ,

Topic summary

A user encountered an opacity issue on their product page using the Dawn theme, where a subtitle (“ultimas unidades disponibles”) and its accompanying image appeared lighter/less opaque than other page elements. Shopify support was unable to resolve the problem.

Solutions Provided:

Three community members offered CSS-based fixes:

  • Solution 1: Add .product__description .markdown{opacity: 1;} to the end of base.css file
  • Solution 2: Insert custom CSS code in theme.liquid file above the </body> tag targeting the same opacity issue
  • Solution 3: Use the theme customizer’s Custom CSS section to add .product__description .light {opacity: 1;}

All solutions target CSS opacity properties affecting the product description area. The original poster confirmed the issue was resolved, thanking multiple contributors.

Status: Resolved - CSS opacity override successfully corrected the display issue.

Summarized with AI on October 27. AI used: claude-sonnet-4-5-20250929.
1

Hi everyone, i have an issue with one of my product page. in this case, how it shows in the image, the opacity of the color in the subtitle “ultimas unidades disponibles” is less than the rest of the page, and also it happens with the image of the same subtitle. i already tried contacting with the shopify support but they couldnt help me, so if someone here knows something about this problem, it would be a great help. (Im using the DAWN theme) Thanks!

Captura de pantalla (384).png
Captura de pantalla (384).png1366×768 201 KB

1 Like
2

@juanzz - please add this css to the very end of your base.css file and check,
Shopify Admin → Online Store ->Theme → Edit code → base.css

.product__description .markdown{opacity: 1;}
1 Like
3

Hey @juanzz

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-1749057010719.png
Moeed_0-1749057010719.png620×409 44.9 KB

If I managed to solve your problem then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

1 Like
4

Hi @juanzz

Let try to go to:

Admin → Sale Channels → Online Stores → Theme → click Customize your current theme → select Theme Settings → scroll down to section Custom CSS then add this code:

.product__description .light {
  opacity: 1;
}

the result:

BiDealDiscount_1-1749057067012.png
BiDealDiscount_1-1749057067012.png1277×887 208 KB

1 Like
5

thanks bro!

6

Thanks bro!

1 Like
7

Thank you for your reply. I’m glad to hear that the solution worked well for you. If you require any more help, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.