How can I change the "Sale" tag color in sense theme?

Shopify Discussion

Topic summary

A user seeks guidance on changing the color of the “Sale” tag in Shopify’s Sense theme.

Proposed Solutions:

Two responders provide similar CSS-based approaches:

  • Navigate to Themes → Edit Code → Assets → base.css
  • Add custom CSS code at the bottom of the file targeting .badge.markup
  • Modify properties like background, border-color, and color to desired values (examples include orange, blue, white, or hex codes like #ff0000)

Current Status:

The discussion remains open with no confirmation from the original poster on whether the solutions worked. Both answers offer the same technical approach with slight variations in color examples.

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

Hello! I wanna know how can I change the “Sale” tag color in sense theme? Any help is appreciated. Thanks!

Screen Shot 2022-12-26 at 16.32.15.png
Screen Shot 2022-12-26 at 16.32.15.png259×438 48.4 KB

2

HI @antoo

You can try follow this path:
Themes => edit code => asset => base.css
and add this code to bottom of the file base.css
you can try to change the value of the style

.badge {
background: orange;
border-color: white;
color: blue;
border-radius: 10px;
}
2 Likes
3

Hello @antoo

It’s GemPages support team and glad to support you today.

You can follow these steps:

  1. Go to Online Store → Theme → Edit code
  2. Open your base.css file and paste the following code below:
.badge{
    background: #ff0000;
    border-color: #ff0000;
}

If you require any further information, feel free to contact me.
Best regards,
GemPages Support Team

1 Like