How can I modify the filter option pill shape for a cleaner look?

Topic summary

Goal: restyle the selected filter option “pill” (rounded filter chip) on Shopify collection pages to a simpler, cleaner look on both desktop and mobile.

Process and inputs:

  • A preview link was shared so the helper could review the current implementation.
  • Images were provided showing the current pill style and the desired simplified style; these visuals are central to understanding the change.

Solution provided:

  • In the Shopify admin: Online Store > Edit Code > open theme.liquid.
  • Insert custom code just above the closing tag to adjust the selected filter pill styling.
  • A result image demonstrated the updated, cleaner pill appearance. Note: the exact code snippet content was not visible in the post.

Outcome:

  • The original poster confirmed the solution worked.
  • Status: resolved; no outstanding questions or follow-ups indicated.
Summarized with AI on January 13. AI used: gpt-5.

Hello. I am looking for some help in modifying the style of the of the pill shape when selecting a filter option on both desktop and mobile. Right now it looks like this when a user selects a filter option:

But I want it to look more simple and clean like this:

Is this possible to do?

Can you provide link to your store?

Hi.

Here’s a link to a draft where I’ve been playing around with:

https://1iy33mtqclf7spjb-46277427353.shopifypreview.com/collections/shop

Hi @CherylAnne ,

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code just above tag


Result:

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
Makka

This worked!

Thank you so much for all your help. It is greatly appreciated.