Dawn Theme: Change background and text color for all products page and associated sections

Store Design

Topic summary

A user seeks to change the background to black and text to white across all product pages in the Dawn theme, including associated sections like “you may also like” and review apps. Initial CSS attempts only affected the main product area, not related sections.

Proposed Solution:

  • A helper provided CSS code targeting the specific product section ID with background: black and color: white properties
  • When the initial code didn’t work, they suggested adding !important flags to override existing styles
  • The code should be added to the base.css file in the theme’s Assets folder

Additional Requests:
The original poster later asked for CSS to style specific product page buttons:

  • Quantity selector (-, number, +): white borders, black background, white text
  • “Add to cart” button: black background, white text, white borders
  • “Buy now” button: white background, black text

A second user joined with a similar request for black background and white text in Dawn theme, awaiting assistance with their store URL.

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

Hi everyone !

I want to change only the background and text color for my product pages and associated sections.

I want the background in black and texte in white

How can i add all of that in custom CSS ?

When i tape this:

{background: #121212;}

It only change the background for product but not the background for “you can also like” or the background of reviews app.

Thank you !

1 Like
2

Hi @CryptoSafe ,

Would you mind to share your URL website? with password if its protected. Thanks!

3

Hello !

My url is:
cryptosafe-fr.com

Thank you !

1 Like
4

Thank you for the information. 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” 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.
section#shopify-section-template--19177753805126__main * {
    background: black;
    color: white;
}

Result:

Ribe_Dagandara_0-1688410934703.png
Ribe_Dagandara_0-1688410934703.png1348×597 159 KB

I hope it help.

5

Hello,

Thank you but it didn’t work it’s still the same.

1 Like
6

I dont see the code in the base.css file, you paste on other file? If its not working try this one instead.

section#shopify-section-template--19177753805126__main * {
    background: black !important;
    color: white !important;
}
7

Thank you i found the solution with chatgpt in personnalized css but do you know wich css code i can use to change the “add to cart button”, the button with quantity and the button “buy now” on my product pages ?

I want the -, the quantity and the + button to be with white borders, the background in black as on the picture and the text in white.

For the “add to cart” i want it with black background, white texte and white borders.

And for the “buy now” i want it with white background and black text.

Do you have a solution ?

Thank you !

Capture d’écran 2023-07-04 à 14.12.52.png
Capture d’écran 2023-07-04 à 14.12.52.png2880×1800 607 KB

8

can someone help me change this? The background should be black and the font texts is in white. I tried looking for relevant samples but it is not working. Theme is in Dawn.

9

Hi @raffles_fleur

Please, share your store URL. Thanks!