Hi i want to change the color of the price from black to redd

Retired Boards Appdev Store Design
,

Topic summary

A user wants to change their product price color from black to red but couldn’t do so through theme options.

Solutions Provided:

  • saim007: Add custom CSS code above the </body> tag in theme.liquid file
  • PageFly-Henry: Insert CSS targeting .card-information > .price in the base.css file at the bottom. Also offered bonus code to center the header
  • Made4uo-Ribe: Provided CSS targeting .price-item span elements, asking for clarification on whether both original and sale prices should be red, and whether the change applies to featured collections only or also product pages

User Follow-up:

The original poster asked if only the sale price (ÂŁ28.99) can be made red, suggesting they want selective color changes rather than all prices.

Status: Awaiting response on specific requirements before final implementation.

Summarized with AI on November 8. AI used: claude-sonnet-4-5-20250929.
1

I was unable to change the color from black to red in the theme options. This is my link store: https://f82f32-e9.myshopify.com/

1 Like
2

Go to Edit Code > open theme.liquid file and search for the tag and above this tag just paste below code -

Please let me know when works and mark as solution!

3

Hi @MonkataWe

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps:

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

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file → Save

.card-information>.price {

color: red !important;

}

Hope that my solution works for you.

Best regards,

Henry | PageFly

4

Additionally, you can use this code to make the header centerable like this:

header {
grid-template-columns: unset !important;
}

nav.header__inline-menu {
display: flex;
flex-direction: row;
justify-content: center;
}

PageFlyHenry_0-1718027264653.png
PageFlyHenry_0-1718027264653.png1321Ă—262 16.9 KB

5

Hi @MonkataWe

Do you like to make all red including the original price? or not?

Made4uoRibe_0-1718027964547.png
Made4uoRibe_0-1718027964547.png366Ă—188 25.5 KB

Also, only on the feature collection or also in the product page?

This is code I use for the shared image.

From your Shopify admin dashboard, click on “Online Store” and then “Themes”.

Find the theme that you want to edit and click on “Actions” and then “Edit code”.

In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

span.price-item.price-item--sale.price-item--last {
    color: red;
}

And save.

6

can i make only the ÂŁ28.99 red?