Change Shop Pay Logo Color on Product Page

Change Shop Pay Logo Color on Product Page

fishman1
Tourist
4 0 2

Hi All,

 

On the product page, I'm trying to change the purple logo below to black.

 

fishman1_0-1729721964346.png

 

It's an SVG which I think I can change via CSS in the main.css file. I've tried a few variations (below) with no success.

 

shop-pay-logo svg {
   fill: rgb(0 0 0);
}

 

svg.shop-pay-logo {
   fill: rgb(0 0 0);
}

 

Any other suggestions?

 

Thanks in advance!

Replies 2 (2)

Entaice
Trailblazer
149 10 42

You can try targeting the SVG directly by using this CSS snippet in your main.css:

```css
img.shop-pay-logo {
filter: invert(1);
}
```

This will invert the colors, which should effectively make the purple logo black. If that doesn’t work, you might need to edit the SVG file itself to change the fill color.

You can increase your revenue by 5% by replacing Shopify's default sorts. Test for free. **Show me how**
fishman1
Tourist
4 0 2

Thanks, unfortunately still unsuccessful. I think you're right about changing the file itself.