WIP: Color preview on hover not work for gradient/overlay

Bugs
1

Browser: Chrome 145.0.7632.117
OS: Windows

Hi,

Color preview on hover feature does not work on Gradient/Overlay colors and svg colors.

2

Hi Hosein,
Thanks so much for your report!

I reproduced the issue with gradient/overlay and added it to our bug tracker.
We’ll update this thread once it’s fixed.

I can’t reproduce it with SVGs, so I suspect it’s once again due to the SVG itself.

Best regards,
timmse

3

Hi Stefan,

I don’t think the problem is with the svg icon. Could you please try this icon?

<svg data-name="shop-icon" width="24" height="24" viewBox="0 0 24 24" fill="currentcolor" xmlns="http://www.w3.org/2000/svg"><path d="M14.7 22.75H9.3c-4.94 0-7.04-2.11-7.04-7.04v-4.49c0-.41.34-.75.75-.75s.75.34.75.75v4.49c0 4.09 1.45 5.54 5.54 5.54h5.39c4.09 0 5.54-1.45 5.54-5.54v-4.49c0-.41.34-.75.75-.75s.75.34.75.75v4.49c.01 4.93-2.1 7.04-7.03 7.04Zm-2.701-10c-1.1 0-2.1-.43-2.81-1.22s-1.04-1.82-.93-2.92l.67-6.68c.04-.38.36-.68.75-.68h4.67c.39 0 .71.29.75.68l.67 6.68c.11 1.1-.22 2.13-.93 2.92-.74.79-1.74 1.22-2.84 1.22Zm-1.65-10-.6 6.01c-.07.67.13 1.3.55 1.76.85.94 2.55.94 3.4 0 .42-.47.62-1.1.55-1.76l-.6-6.01h-3.3Zm7.961 10c-2.03 0-3.84-1.64-4.05-3.66l-.7-7.01c-.02-.21.05-.42.19-.58.14-.16.34-.25.56-.25h3.05c2.94 0 4.31 1.23 4.72 4.25l.28 2.78c.12 1.18-.24 2.3-1.01 3.15-.77.85-1.85 1.32-3.04 1.32Zm-3.17-10 .62 6.19c.13 1.25 1.29 2.31 2.55 2.31.76 0 1.44-.29 1.93-.82.48-.53.7-1.24.63-2l-.28-2.75c-.31-2.26-1.04-2.93-3.23-2.93h-2.22Zm-9.501 10c-1.19 0-2.27-.47-3.04-1.32-.77-.85-1.13-1.97-1.01-3.15l.27-2.75c.42-3.05 1.79-4.28 4.73-4.28h3.05c.21 0 .41.09.56.25.15.16.21.37.19.58l-.7 7.01c-.21 2.02-2.02 3.66-4.05 3.66Zm.95-10c-2.19 0-2.92.66-3.24 2.95l-.27 2.73c-.08.76.15 1.47.63 2s1.16.82 1.93.82c1.26 0 2.43-1.06 2.55-2.31l.62-6.19h-2.22Zm7.911 20h-5c-.41 0-.75-.34-.75-.75v-2.5c0-2.1 1.15-3.25 3.25-3.25s3.25 1.15 3.25 3.25V22c0 .41-.34.75-.75.75Zm-4.25-1.5h3.5V19.5c0-1.26-.49-1.75-1.75-1.75s-1.75.49-1.75 1.75v1.75Z"/></svg>

Thanks

4

It looks like the problem has already been fixed:

CleanShot 2026-04-08 at 08.29.56

1 Like
5

It seems to work fine in svg element. But in other elements like icon and button if you use svg icon, there is this problem.

Thanks

6

Oh, okay — It would never have occurred to me to test with a button… :smiley:

It would be great if you could make your reports a bit more specific: just name the element you’re testing/having the issue with :v:

Anyways, I can replicate it with the icon and button elements, since the control is the same.