Remove product colour swatch border

Topic summary

A user seeks help removing the light grey border around color swatches in the Shopify Symmetry theme while preserving the black border that indicates the customer’s selected color.

Proposed Solution:

  • Another user suggests adding custom CSS code to the theme.liquid file, placed before the closing </body> tag
  • The code snippet appears to target swatch borders with styling modifications

Current Status:

  • Solution has been offered but not yet confirmed as tested or working
  • The discussion remains open pending verification from the original poster
Summarized with AI on November 6. AI used: claude-sonnet-4-5-20250929.

Hi, does anyone have any advice on the best way possible to remove the border around colour swatches in symmetry theme? If possible I want to be able to keep the black border that highlights the colour selected by the customer but remove that light grey boarder from all the colour option?

Thank you!

URL – https://pantee.co.uk/?_ab=0&_fd=0&_sc=1&preview_theme_id=144118972631

Screenshot 2024-08-29 at 16.59.45.png

Hi @emilyaugstudios
Please put this code in theme.liquid before body closing tag


Please press Like and Mark Solution if you find it helpful.

Thanks!

1 Like