Class ChartGradientColorStop

Represents a single color stop that defines a color transition for the series gradient fill. A color stop determines how the current color blends at its position in the gradient.

Inheritance
object
ComponentBase
OwningComponentBase
SfOwningComponentBase
ChartSubComponent
ChartGradientColorStop
Implements
Inherited Members
Namespace: Syncfusion.Blazor.Charts
Assembly: Syncfusion.Blazor.dll
Syntax
public class ChartGradientColorStop : ChartSubComponent, IComponent, IHandleEvent, IHandleAfterRender, IDisposable
Remarks

A stop is identified by its Offset (0–100). Use Color to set the color, Opacity to control transparency, and optionally Lighten and Brighten to fine-tune the resulting tone.

Declare multiple stops within ChartGradientColorStops to produce smooth transitions across the gradient span.

Examples
@using Syncfusion.Blazor.Charts

<SfChart>
    <ChartSeriesCollection>
        <ChartSeries Type="ChartSeriesType.Area"
                     XName="Category"
                     YName="Value">
            <ChartRadialGradient Cx="0.5" Cy="0.5" Fx="0.5" Fy="0.5" R="0.6">
                <ChartGradientColorStops>
                    <ChartGradientColorStop Offset="0"   Color="#FFE082" Opacity="1" />
                    <ChartGradientColorStop Offset="100" Color="#FFCA28" Opacity="1" />
                </ChartGradientColorStops>
            </ChartRadialGradient>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

Constructors

ChartGradientColorStop()

Declaration
public ChartGradientColorStop()

Properties

Brighten

Gets or sets the brightness adjustment for the color at the gradient stop.

Declaration
[Parameter]
public double Brighten { get; set; }
Property Value
Type Description
double

A double factor where positive values increase brightness and negative values decrease it. The default value is 1.
Remarks

Applies a brightness multiplier to the base color before rendering the stop.

Color

Gets or sets the color of the gradient stop.

Declaration
[Parameter]
public string Color { get; set; }
Property Value
Type Description
string

A string accepting CSS color formats such as HEX, RGB/RGBA, HSL/HSLA, or named colors. The default value is string.Empty.
Remarks

When empty, theme defaults may be applied by the chart.

Lighten

Gets or sets the lightness adjustment for the color at the gradient stop.

Declaration
[Parameter]
public double Lighten { get; set; }
Property Value
Type Description
double

A double where positive values lighten and negative values darken the color. The default value is 0.
Remarks

Adjusts the perceived lightness of the color at the stop to fine-tune transitions.

Offset

Gets or sets the position of the gradient stop as a percentage value.

Declaration
[Parameter]
public int Offset { get; set; }
Property Value
Type Description
int

An int ranging from 0 to 100, representing the position of the color stop. The default value is 0.
Remarks

Defines the stop location along the gradient axis; 0 represents the start and 100 represents the end.

Opacity

Gets or sets the opacity of the gradient stop.

Declaration
[Parameter]
public double Opacity { get; set; }
Property Value
Type Description
double

A double in the range 0 (transparent) to 1 (opaque). The default value is 1.
Remarks

Controls the transparency at this stop position.

Implements