Wishlist heart filled when added to wishlist.

[Loulouis]

I want the wishlist icon to only fill the the heart and not create a circle around the entire thing. I have been trying to edit the fill of the svg, but it only changes the outline of the heart. Can someone help?

Website is https://loulouis.no

[CarrotCake]

What's the name of the app that you're using? 

Did you figure it out in the end? 🙂

[Sachin]

I have worked on many Shopify stores and faced this exact issue a couple of times while customizing wishlist icons. The thing is, when you add a product to the wishlist, some themes or apps by default fill the heart icon and also add a circle or background around it, which honestly doesn’t look clean.

The trick here is to make sure you’re only changing the fill color of the heart itself and not any background or extra shape around it. Most of the time, this happens because the icon design includes an extra layer or background in the SVG, so it’s a good idea to double-check the structure of your icon.

I’ve done this on a few client stores, and once you remove or adjust that extra layer or make sure the fill is applied only on the heart shape, it works perfectly — the heart fills up without adding any circle around it.

You can check app demo and app details from below URLs:

APP URL: https://apps.shopify.com/wishlist-guru

DEMO URL: https://wishlist-guru.myshopify.com/

Let me know if this helps you!