Strange gradient display in Safari


I’ve added some gradients on my site, one to the whole body, another to the div at the bottom. It looks as I inteded in Chrome, but in latest Safari colors are completely different. Seems like a bug?

Additionally design question: what is the way to set background gradient to the whole page so it won’t interrupt upon scroll?

Here are screenshots Chrome at the top vs Safari at the bottom


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

1 Like

Hi @radmitry

This is a known quirk with Safari gradients that have a transparent color stop.

To resolve this you can edit the color to be 0% opacity on white, rather than on black (GIF).

Hope this helps!

1 Like

Thanks a lot @Brando ! That definitely solves an issue with the bottom div gradient, but what about the fact that the colors of body gradient is so greenish in Safari versus very subtle green in Chrome?

Check this out on Codepen



Gor it @bart thanks


This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.