Home → Problems →

Rendering problem: gradients (either in SVG or CSS3 gradients) get wrong colors

• Edit

salvo nicolosi

Aug 28, 2014 @ 09:03 AM

Try to open the following page in TFF 31.0 and any other browser (current Safari, Firefox, Chrome).
In all the other browsers the colors are displayed correctly, while gradients in TFF 31.0 look like "shifted" in lightness or gamma...
This is particularly visible in the places where a "flat" SVG (i.e. the curved green background) is under an SVG with gradient (i.e. the leaf)

http://www.ilgiardinodellemeraviglie.it/it

1. Support Staff 1 Posted by Cameron Kaiser on Aug 28, 2014 @ 12:58 PM

   

   A screenshot would be very helpful showing what you believe is different (remember that we are not hardware accelerated, so this comparison should be done on a system using software rendering). Also, gradient code has changed in 31.1.

   • Edit

2. 2 Posted by salvo nicolosi on Aug 28, 2014 @ 03:08 PM

   

   Thanks Cameron!
   Here it is: two screenshot, first is TFF, second is Safari

   • tff.png 1.52 MB
   • safari.png 1.34 MB
   • Edit

3. Support Staff 3 Posted by Cameron Kaiser on Aug 28, 2014 @ 03:22 PM

   

   Please try these two tests:

   • In your current browser, go to about:config and change gfx.canvas.azure.backends and gfx.content.azure.backends to cairo. Restart the browser (graphics will be slower). Does the page change? After you're done, please turn them back from cairo to cg and restart the browser again.

   • Please download this test build, which includes the gradient changes that will be part of 31.1 to come out this week: http://sourceforge.net/projects/tenfourfox/files/unstable/31.1pre/T... Does the page change?

   • Edit

4. 4 Posted by salvo nicolosi on Aug 28, 2014 @ 04:22 PM

   

   Here are the results of the test:

   1) about:config > cg to cairo => the page looks ok

   2) using the test build => visualization error is still there

   • test1-cairo.png 1.6 MB
   • test2-unstable.png 1.52 MB
   • Edit

5. 5 Posted by upunkt on Dec 05, 2014 @ 05:01 PM

   

   FYI This rendering problem persists in TFF 31.3.0. The "cairo"-setting helps, but makes graphics slow, so getting this sorted would be very much appreciated. Good to know that it's only TFF that's misinterpreting gradients.

   Anyway, thanks for your great work!

   • Edit

6. Support Staff 6 Posted by Cameron Kaiser on Dec 05, 2014 @ 05:13 PM

   

   That's because it hasn't been fixed. The problem is in the custom library we use to emulate CGGradient on 10.4, but I don't know where the issue exists. Rendering fidelity is important and I intend to fix this at some point, but since it is primarily cosmetic, it occurs on a subset of sites and there is a workaround where it matters, this isn't a high priority right now.

   If you have a patch, I'd be willing to review it, but if not I will look at it when higher priority issues are dealt with. The problematic section of code is in gfx/2d/CTGradient.m.

   • Edit

7. 7 Posted by funtoosh on Jun 09, 2016 @ 10:02 AM

   

   Ups, this same bug took me by surprise today -- the fact that it is still around in TFF 38.9 probably means there will be no more fix for it, right?

   Best,
   -f

   • Edit