Accessibility in Flutter Circular Charts (SfCircularChart)

7 Aug 20251 minute to read

Sufficient contrast

The SfCircularChart theming support offers a consistent and standardized look, as well as the ability to set the colors for all UI elements.

The customization of colors can be done for the following chart elements.

• Chart title
• Series palette
• Color mapping for data points
• Shader for data points
• Data label
• Legend title
• Legend item text
• Series tooltip
• Selected segments

Large fonts

The SfCircularChart font size can be adjusted automatically based on device settings and the font size scaled based on the MediaQueryData.textScaler. It also allows you to change the font size of all elements in Circular chart.

• Chart title
• Data label
• Legend title
• Legend item text
• Series tooltip

Easily tappable targets

The SfCircularChart provides callback support to notify when tapping on the essential elements in the chart.

• Data points
• Data labels
• Legend