How to change Featured Collection Sold Out Badge Color

Topic summary

A Shopify store owner using Dawn 13.0 theme wants to change the “Sold Out” badge color from green to grey across all pages to avoid confusion with the green “Sale” badge.

Initial Solution:

  • A helper provided CSS code to add to the base.css file targeting the sold-out badge
  • The code initially worked, changing the badge color to grey on product pages

Recurring Problem:

  • The issue resurfaced: sold-out badges appear green on collection pages but grey on product pages (as desired)
  • The store owner had previously applied the CSS fix but suspects they may have altered the code incorrectly

Technical Challenge:

  • Upon inspection, the badges on collection and product pages use different HTML structures and class names
  • Simply targeting CSS may affect all badges uniformly rather than distinguishing between “Sale” (should be green) and “Sold Out” (should be grey)
  • The helper suggests this may require modifying the Liquid template code to properly differentiate badge types, which would need developer assistance

Current Status:

  • The discussion remains unresolved
  • The store owner is considering opening a new thread or consulting another developer for a more robust solution
  • Custom category templates may also be complicating the implementation
Summarized with AI on November 10. AI used: claude-sonnet-4-5-20250929.

Sure, https://evmotion.shop/collections/the-new-aero-aero

Note: I want to change it for all collections / categories