A clean categorical distribution chart that merges a classic pie with a subtle donut ring for modern readability. Each slice represents a segment of the whole, with the active slice highlighted by an outer stroke and an inline value badge for instant recognition. The top legend mirrors slice colors and labels to keep the chart self-explanatory. Rounded geometry and soft shadows improve contrast without clutter. Works equally well with counts or percentages, and scales smoothly from phones to large dashboards. Built for quick at-a-glance comparisons where one category is emphasized.

Functionality

• Donut/pie rendering with configurable inner radius (solid pie → hollow donut)

• Active slice highlight (outer ring + badge with value/percent)

• Legend with color swatches and labels (toggleable)

• Optional tooltips on tap/hover; slice selection callbacks

• Custom colors, start angle, order, and rounding

• Responsive layout with light/dark theme support

Use cases

• Show category share (e.g., product mix, traffic sources, spend breakdown)

• Emphasize a primary segment in summaries and KPI cards

• Mobile dashboards where quick distribution insight is needed

• Reports and infographics needing clear, color-coded proportions

Keywords

pie chart, donut chart, ring chart, category share, distribution chart, percentage chart, active slice, legend, tooltip, responsive chart, interactive chart, dashboard visualization, KPI, data visualization, Flutter chart, FlutterFlow component, mobile analytics, light mode, dark mode.