Currently, only circle radial gradients for backgrounds can be created in Webflow. However, ellipses can also be used for radial gradients in CSS. This option should be exposed in the Webflow interface to allow for the creation of elliptical radial gradient backgrounds.
Forum thread on this topic that was incorrectly closed (ellipses are not a custom shape, they are defined in the W3 specs): https://forum.webflow.com/t/how-to-create-an-elliptical-radial-gradient/42571
W3 specfication on radial gradients:
Sam Colburn
.svg){kind=logo}
I know a potential workaround!
Make a circular gradient and then 2D transform the DIV to squish it and make it elliptic.
Attachments Open full size
Totally agree. It should be a simple checkbox or toggle - it's just an additional parameter in the CSS rule.
Use case: using a radial gradient that extends to the 4 sides of a non-square DIV to create, for example, an inverted vignette over a background image to make light text more legible.
Attachments Open full size