Changing the colour of a product price on my website

Store Design
,
1

please please please help i cannot change the colour of the products price. its pale pink for some obscure reason and almost invisible. i have tried theme settings ect but it says no settings available for this section. its driving me crazy !!! thanks debz

2

Hello There,

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

3

Hello @Debz68
can you share store URL?

4

hattieandhope22.myshopify.com

5

Please paste this code in your css file.

Go to Online store > Themes > Customize > select that section and add this code to Custom CSS

.price.price--large.price--show-badge {
    color: #FFC0CB !important;
}

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

6

It’s still pink :disappointed_face:

7

what color you want to display, can you give me a code?

or color name

8

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 on theme.liquid

.price .price-item { color: #000 !important; }

techlyser_web_0-1706698516369.png
techlyser_web_0-1706698516369.png239Ă—110 5.21 KB

9

Just black please thanks so much

10

Hello @Debz68 ,

Please add this code in your theme.liquid file for changing the price color to black.

.price.price--large.price--show-badge { color: #2e2b2c !important; }

Output → https://prnt.sc/ByFGVLRCNXGg

I hope this helps.

Please let me know if you have any query.

Thank you.

1 Like
11

Hey @Debz68 ,

Please try this and let me know :blush:

Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
Below the tag “” tag paste the following. Screenshot attached for reference.

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1706701168578.jpeg
ThePrimeWeb_0-1706701168578.jpeg1253Ă—933 87.9 KB

12

Still pink

13

Thanks at last it’s done 1 :blush:

14 
.price.price--large.price--show-badge {
    color: #000 !important;
}

Please paste this code in your css file.

Go to Online store > Themes > Customize > select that section and add this code to Custom CSS and remove the previous code that i asked you to paste ealier.

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