Make Variant Image Swatch Larger (Symmetry theme

[SDBdigital]

Hi

I want to make the image swatches a bit larger on the product pages.
Using symmetry theme.

Example product

https://thesportsconceptstore.co.za/collections/on-for-men/products/cloud-5-mens

I've looked at the theme.css but can't really understand it.

[namphan]

Hi @SDBdigital,

You can try increasing width and height here: 

I hope it helps!

[SDBdigital]

Hi

I tried that - I doubled the px for 22 to 44.

But it didn't make a difference - I tried 3 different browsers.

[namphan · Accepted solution]

Hi @SDBdigital,

Please go to Actions > Edit code > Assets > main.css file and paste this at the bottom of the file:

.swatch-style-icon_square .option-selector .opt-label--image {
    --swatch-picker-image-size: 50px;
}

You can change the number as you like, it will display well

[SDBdigital]

Thank you - much appreciated.