Change Product Name and Price Color on Homepage Debut Theme

[md249]

Hello,

I'm using the debut theme and I need to change the color of my product name and price on the homepage. Here is a link to my site preview: 

https://8dk3dtko14xkkdw0-68119757090.shopifypreview.com

Thanks!

[MarinaPetrovic]

Hi @md249 , go to edit code > assets > theme.css and add this:

.product-card__title,
.price-item{
color: red!important;
}

Instead of red write any colour you'd like. 🙂

[md249]

Thanks! @MarinaPetrovic 

This is the code I just added in, and it doesnt appear to have updated the color:

.product-card__title,
.price-item{
color: #421224 important;
}

[MarinaPetrovic · Accepted solution]

Hi @md249 , you forgot exclamation mark, change it to this:

.product-card__title,
.price-item{
color: #421224!important;
}

[Jose53]

theme.css is nowhere to be found now in 2024 can you tell me how I can do the same but actually?

[PageFly-Kate]

Hi @md249 

This is Kate from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/theme.css->paste below code at the bottom of the file:

.product-card__title,
.price-item{
color: #421224 !important;
}

 Hope my answer will help you

[made4Uo]

Hi @md249,

Please follow the instructions below to change the product cards in the home page

1. From your Admin page, go to Online store > Themes > click the 3 dots > Edit code

2. The code editor will open, go to Asset folder, and open the theme.css file

3. At the very bottom of your code, delete the following code below that causing some errors. 

.product-card__title,
.price-item{
color: #421224 important;
}

4. Replace this with the code below. NOTE: Minimize using !important as much as possible

.grid-view-item.product-card .price-item, .grid-view-item__title.product-card__title {
    color: red !important;
}

Hope this helps

[Jose53]

theme.css is nowhere to be found now in 2024 can you tell me how I can do the same but actually?