How to change X colour on enlarged images on each product

Solved

How to change X colour on enlarged images on each product

laurenchar
Tourist
3 0 1

I have tried looking through the theme settings but I cannot find anywhere to change the colour of the X when a picture is enlarged on the products. I have attached a picture for reference. I am a complete novice when it comes to this kind of thing so I may of overlooked it.Screenshot 2025-05-27 195541.png

 

any help would be appreciated thank you. 

Accepted Solution (1)
CodingFifty
Shopify Partner
1003 150 174

This is an accepted solution.

Go to your Shopify Admin Panel.

Navigate to Online Store → Themes.

Click on Edit Code (not Customize).

Open the theme.liquid file (found inside the Layout folder).

Scroll down and paste the code just before the </head> tag:

<style>
.product-images-lightbox-close svg {
    color: #000000 !important;
}
</style>
Coding Fifty || Shopify Partner
For any custom section queries, please visit: Fiverr Profile
Found my response useful? Like it and mark as Accepted Solution!
For additional discussions, reach out via: Email ID: codingfifty@gmail.com

View solution in original post

Replies 4 (4)

CodingFifty
Shopify Partner
1003 150 174

Hi @laurenchar,

 

Could you kindly share your store URL and password (if it’s password-protected) so I can review it and provide you with an update?

Coding Fifty || Shopify Partner
For any custom section queries, please visit: Fiverr Profile
Found my response useful? Like it and mark as Accepted Solution!
For additional discussions, reach out via: Email ID: codingfifty@gmail.com
laurenchar
Tourist
3 0 1

www.academydancewear.co.uk - rialtu

 

thank you 

CodingFifty
Shopify Partner
1003 150 174

This is an accepted solution.

Go to your Shopify Admin Panel.

Navigate to Online Store → Themes.

Click on Edit Code (not Customize).

Open the theme.liquid file (found inside the Layout folder).

Scroll down and paste the code just before the </head> tag:

<style>
.product-images-lightbox-close svg {
    color: #000000 !important;
}
</style>
Coding Fifty || Shopify Partner
For any custom section queries, please visit: Fiverr Profile
Found my response useful? Like it and mark as Accepted Solution!
For additional discussions, reach out via: Email ID: codingfifty@gmail.com
laurenchar
Tourist
3 0 1

fab thank you that has worked!