Skip to main content
EllipticalGradient(props?: { colors: Color[]; center?: UnitPoint; startRadius?: number; endRadius?: number }): Gradient;

​
Parameters

​
props
{ colors: Color[]; center?: UnitPoint; startRadius?: number; endRadius?: number }
Elliptical gradient configuration.

​
Support

​
Usage

​
Basic elliptical gradient

EllipticalGradient({
    colors: [Color("purple"), Color("pink")]
})

​
Gradient with custom center

EllipticalGradient({
    colors: [Color("cyan"), Color("blue"), Color("navy")],
    center: "bottomLeading"
})

​
Gradient with custom radius

EllipticalGradient({
    colors: [Color("gold"), Color("orange")],
    startRadius: 10,
    endRadius: 150
})

​
Soft vignette effect

EllipticalGradient({
    colors: [Color("transparent"), Color("black").opacity(0.6)],
    center: "center",
    startRadius: 50,
    endRadius: 300
})