How to alter price and sales color on Impulse theme?

Topic summary

Users of Shopify’s Impulse theme are seeking to differentiate regular prices from sale prices through color coding—typically wanting regular prices in black and sale prices in red, with strikethrough original prices in grey.

Initial Solution Provided:
A CSS code snippet was shared to add to the theme.scss.liquid file:

  • .grid-product__price { color: #ff0000; }
  • .grid-product__price--original { color: #000; }

Recurring Problem:
Multiple users report this code incorrectly colors ALL prices red, including non-sale items. The desired outcome is:

  • Regular (non-sale) prices: black
  • Original prices (strikethrough): grey
  • Sale prices: red

Refined Solution:
An updated CSS selector was provided:

  • .grid-product__price--original + span + span.money { color: #e23737; }
  • .grid-product__price--original { color: #ccc; } (for grey strikethrough)

Current Status:
The discussion remains ongoing with several users still troubleshooting implementation issues. The helper (KetanKumar) continues requesting site URLs to provide customized solutions, and some users have shared private login details for direct assistance. One user mentions the issue also affects the Flex theme.

Summarized with AI on October 24. AI used: claude-sonnet-4-5-20250929.

Hi @KetanKumar , I’m using the impulse theme as well, and having the same issue about the sale price and original price’s colour.

The non-sale prices’ colour will be changed to red at the same time if I used the code you provided up there.

My purpose is: sale products → original price keep black colour, sale price is changed to red colour

non-sale products → no colour change on price, keep black

Could you please provide me any help that can solve this problem. Thank you so much.

1 Like