How change color of SOLD status?

Our main page shopping page says SOLD in the description for sold out items. I want it to read as red and have changed the color in Products: Basic Grid: Status, but it doesn't change it on the page. Any suggestions? 

If SS can't, CSS can.

But can you share link to your site?

perch-tetra-xfyf.squarespace.com 

password: test

Add to Home > Design > Custom CSS

.product-mark.sold-out {
    color: red;
}

15 hours ago, tuanphan said:

Add to Home > Design > Custom CSS

.product-mark.sold-out {
    color: red;
}

 

You're awesome! Thank you!

On 3/14/2020 at 5:02 PM, tuanphan said:

Add to Home > Design > Custom CSS

.product-mark.sold-out {
    color: red;
}

 

I am trying to do something similar, but this isn't working for me.  Can you make any suggestion to turn the "Sold Out" label turn red on my products? 
https://manifestphoto.com/pandemic-art-sale

Thank you so much!

19 hours ago, PeterCBlanchard said:

I am trying to do something similar, but this isn't working for me.  Can you make any suggestion to turn the "Sold Out" label turn red on my products? 
https://manifestphoto.com/pandemic-art-sale

Thank you so much!

.product-mark.sold-out {
    background: red !important;
    color: violet !important;
}

11 hours ago, tuanphan said:

.product-mark.sold-out { background: red !important; color: violet !important; }

Brilliant!! Thank you so much!

So helpful! Just used this to change the colours and replaced red etc with a hex code to customise them. THANK YOU @tuanphan

On 5/19/2020 at 2:06 PM, tuanphan said:

.product-mark.sold-out {
    background: red !important;
    color: violet !important;
}

 

Hi, I’ve just used this and it worked perfectly on my website, however it hasn’t transferred the same colours to the mobile app. Please could you let me know how to do the same for mobiles? Thank you!

4 minutes ago, Kateillustrate said:

Hi, I’ve just used this and it worked perfectly on my website, however it hasn’t transferred the same colours to the mobile app. Please could you let me know how to do the same for mobiles? Thank you!

Can you share shop page url? We can check easier.

6 minutes ago, tuanphan said:

Can you share shop page url? We can check easier.

Thank you for your quick reply and apologies for wasting your time. It didn’t initially show after saving and updating, but later on it has updated properly and is working perfectly. Thank you again!

Hey folks - i'm trying to make this same adjustment (though now in 2023). Could anyone give me a hand implementing this properly? The variations I'm playing with aren't working irritatingly.

Link is https://www.pansy-shop.com/shop-ceramics

Thank you in advance!

On 1/16/2023 at 10:39 PM, blueish said:

Hey folks - i'm trying to make this same adjustment (though now in 2023). Could anyone give me a hand implementing this properly? The variations I'm playing with aren't working irritatingly.

Link is https://www.pansy-shop.com/shop-ceramics

 

Thank you in advance!

Add to Design > Custom CSS

.product-mark.sold-out {
    background-color: #f1f !important;
}