Change the color and size of price

Hello @nibfreelancer!

This can be fixed with some custom CSS. Under Appearance > Customize > Additional CSS, you can add the following code:

.single-product.woocommerce div.product span.price {
color: #0004ff;
font-size: 1.6em;
}

This is the result:

If you’d like to learn more about CSS, I highly recommend using the free tutorials at w3schools.com. Here, you can find the basics of selectors (how to target the right element on the page), and properties (how to change the element on the page).

Hope this helps!

Thank you Mirko, but that also affects the price of related products, especially if I change the size…

Hi @nibfreelancer

You can replace the code with the following:

body.woocommerce div.product p.price {
color: #0004ff;
font-size: 1.6em;
}

This won’t affect the related products’ prices.

Obs.: You can replace the 1.6em size and the #0004ff color code with any other values you’d like. You can use the page below to generate HEX color codes:
https://htmlcolorcodes.com

I hope that helps

No Berg, that code only increased the price range below the title, not the price of the variable that is in green (that’s what I need)
Check

I think I solved it with this css:

.woocommerce-variation-price {
color: #000000;
font-size: 2.6em;
}

Thanks for letting us know.

If you have any further questions, I recommend creating a new thread since this one is already tagged as resolved.

Thank you.