1616108 - SVG radialgradient not smooth

Status: NEW

(Core :: Graphics: WebRender, defect, P3)

Description

[jbstrater]

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:72.0) Gecko/20100101 Firefox/72.0

Steps to reproduce:

https://codepen.io/sidewayss/pen/NWqrKKp
I have viewed it in Firefox and Chrome (latest versions) on Windows 10 64bit.
In Firefox you can see rings as the gradient switches colors.
In Chrome, the gradient changes colors more smoothly, invisibly.
In the codepen page, it helps to size the code smaller to see the entire SVG image.

Comment 1

[Ting-Yu Lin [:TYLin] (PDT, UTC-7)]

Hi jbstrater, I open the URL in the description, but <svg> only renders as a black rectangle either in Firefox or Google Chrome. Did I miss anything?

Comment 2

[jbstrater]

Maybe I should make it a linearGradient, as I see the same issue there. It's all very dark, but you should see a slight color change from the center out to the edges, and in Chrome it's smooth, in Firefox it's segmented. I can take a screenshot and upload it, in case our color configurations are causing a difference. I'm running my monitor in sRGB mode.

Comment 3

[jbstrater]

I have modified the codepen so that the color changes are more drastic. I don't see a way to upload the pair of screenshot .png files I created.

Comment 4

[jbstrater]

Attachment: CHgradient.png

Comment 5

[jbstrater]

Attachment: taken in Chrome

Comment 6

[jbstrater]

Attachment: taken in Firefox

Comment 7

[Ting-Yu Lin [:TYLin] (PDT, UTC-7)]

Thank you! Now I can see the issue as described in comment 2 (after adjusting my screen's brightness).

Comment 8

[jbstrater]

Great. Note that the same issue exists for linearGradient. Thanks.