How to change the text color of the sale badge?

[myl1]

Hi hi, 

I would love to change the text color of the sale badge, but I can't find how to do this. Can someone help me? As you can see it's white now and it has to be black because people can't read it now 😞 

Thanks in advance! 

[dws_pvt_ltd]

Hello @myl1, 

Please share your store URL and password.So that I will check and let you know the exact solution here.

Feel free to reach out if you have any questions or need assistance.
Best Regards,
DWS.

[myl1]

https://atelierpomme.nl/ 

Code:2894

[Tech_Coding]

Hello @myl1 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
   .badge--onsale {
      color: #000 !important;
   }
</style>

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.

[dws_pvt_ltd]

Hello @myl1 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code
Step 2: Search file base.css, theme.css, styles.css, custom.css or theme.scss.liquid
Step 3: Insert the below code at the bottom of the file -> Save

<style>
span.badge.badge--onsale {
    color: #000;
}
</style>

Output:-

Best Regards,
DWS.

[AnneLuo]

Hi, @myl1 

Can you please share the store URL so that I can assist you?

[myl1]

https://atelierpomme.nl/ 

Code: 2894

[AnneLuo]

I have applied the access. Please accept.

[DaveedValencia]

Add the following CSS but change the color from red to your desired color. 

.price__sale .price-item--regular {
  color:red;
}

[BSSCommerce-HDL]

Hi @myl1, 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag:

<style>
.card__badge .badge.badge--onsale {
    color: black !important;
}
</style>

Here is result: 

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[PageFly-Richard]

Hi @myl1 

This is Richard from PageFly - Shopify Page Builder App

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the </head>

<style>
 .badge--onsale {
      color: #000 !important;
   }
</style>

Hope this can help you solve the issue 

Best regards,

Richard | PageFly 

[Amanda_Fordeer]

@myl1 

Have you done this?

If not, you can consider using Product Labels&Badges to do that.