# CircularChart

Read the complete [LICENSE](https://snowui.dev/LICENSE) for the installed version before use.

Show proportions as a ring or pie with segments, rounded ends, ring thickness, and hover emphasis.

We are building SnowUI components into interfaces people can use directly in AI conversations. Conversational UI is still in development; this page demonstrates website usage. Supported chat platforms and component versions will be announced after verification. Generating and using SnowUI interfaces inside AI conversations is completely free. It is not a project, uses no project or developer-seat quota, and requires no SnowUI registration, activation, or paid proof.

Package: `@snowui-design-system/components`. Import: `import { CircularChart } from '@snowui-design-system/components';`. Source fingerprint: `0326972d00d0c7abdd9b65ba97dea494566541ca911e4b248f2ee5ceba0d97ef`.

## Usage choices

Use CircularChart for category proportions in a ring or pie. For goal completion, choose GaugeChart or Progress according to the meaning. Configure colors and labels through public Props.

- Each data item needs a name and finite positive value. Only the first maxItems valid items appear, and their sum is the percentage denominator. An explicit empty array shows an empty chart.
- Prefer numeric size. String geometry parses only the numeric portion, so percentages and CSS variables do not provide reliable responsive geometry. Use public center-label, segment-value, and segment-name roles for center content.
- The default root accessible name follows LocaleProvider through `circularChart.name`; an explicit `aria-label` takes priority. Business names, data values, and numeric formatting remain controlled by the caller.

## Read as needed

- [API](https://snowui.dev/llms/en/components/circular-chart/api.md): Public Props and defaults
- [Types and states](https://snowui.dev/llms/en/components/circular-chart/types.md): Public type declarations and binding rules
- [Full reference](https://snowui.dev/llms/en/components/circular-chart/reference.md): Composition and interaction boundaries
- [Styles](https://snowui.dev/llms/en/components/circular-chart/styles.md): Registered public overrides
- [Examples](https://snowui.dev/llms/en/components/circular-chart/examples.md): Code and preview links
- [Image index](https://snowui.dev/llms/components/circular-chart/images.json): Use only if appearance remains uncertain
- [Changelog](https://snowui.dev/llms/en/components/circular-chart/changelog.md): Version history reviewed in English

[Design guide](https://snowui.dev/llms/en/design-system.md) · [Styling guide](https://snowui.dev/llms/en/styling.md)