Chart - Styling
The Chart component supports color palettes, axis configuration, and legend customization — the same styling options available in ASP.NET Web Forms.
Color Palettes
Use the Palette property to set a color scheme. Available palettes: BrightPastel, Berry, Chocolate, EarthTones, Excel, Fire, Grayscale, Light, Pastel, SeaGreen, SemiTransparent.
BrightPastel (Default)
Berry
Fire
SeaGreen
Axis Configuration
Configure axis titles, minimum/maximum values, and intervals using the Axis class.
<ChartArea Name="TempArea"
AxisX="@(new Axis { Title = "Time of Day" })"
AxisY="@(new Axis { Title = "Temperature (°F)", Minimum = 50, Maximum = 100, Interval = 10 })" />
More Palette Examples
Chocolate
Excel
Grayscale
Pastel
Custom Series Colors
Override the palette for individual series using the Color property with a WebColor.
<ChartSeries Name="Actual"
ChartType="SeriesChartType.Column"
Color="WebColor.DodgerBlue"
Points="@actualData" />
<ChartSeries Name="Target"
ChartType="SeriesChartType.Line"
Color="WebColor.OrangeRed"
Points="@targetData" />
Background Gradient Styles
Use BackGradientStyle with BackSecondaryColor to apply CSS gradients to the chart container.
The gradient blends the chart's BackColor with BackSecondaryColor.
TopBottom
LeftRight
Center (Radial)
DiagonalLeft
<Chart BackColor="WebColor.Navy"
BackSecondaryColor="WebColor.LightSkyBlue"
BackGradientStyle="GradientStyle.TopBottom">
...
</Chart>
Border Dash Styles
Use BorderlineDashStyle to set the CSS border style on the chart container.
Solid
Dash
Dot
DashDot
<Chart BorderlineDashStyle="ChartDashStyle.Solid"
BorderColor="WebColor.Black" BorderWidth="2">
...
</Chart>
AntiAliasing (Migration Compatibility)
The AntiAliasing property is marked [Obsolete] because canvas rendering always applies
anti-aliasing. It compiles without errors for migration compatibility.
@* Suppress obsolete warning for migration compatibility *@
#pragma warning disable CS0618
<Chart AntiAliasing="AntiAliasingStyles.All">
...
</Chart>
#pragma warning restore CS0618