Components/Chart(6)

Design system primitives: buttons, badges and other building blocks our sections are composed from. Install one and reuse it across your whole project.

Area Chart

area-chart

Recharts area chart on the shadcn ChartContainer: multi-series with per-series gradient fills, optional stacking, grid, y-axis, legend, and a theme-aware tooltip. Config-driven colors via --chart tokens.

Bar Chart

bar-chart

Recharts bar chart on the shadcn ChartContainer: grouped or stacked multi-series bars with rounded corners, optional grid, y-axis, legend, and a dashed-indicator tooltip. Config-driven colors via --chart tokens.

Line Chart

line-chart

Recharts line chart on the shadcn ChartContainer: multi-series lines with configurable curve, optional dots, active-dot hover, grid, y-axis, legend, and a theme-aware tooltip. Config-driven colors via --chart tokens.

Pie Chart

pie-chart

Recharts pie/donut chart on the shadcn ChartContainer: per-slice colors from config, adjustable donut hole, optional legend, and a name-keyed tooltip. Config-driven colors via --chart tokens.

Radar Chart

radar-chart

Recharts radar chart on the shadcn ChartContainer: multi-series polar areas with a polar grid, angle axis, adjustable fill opacity, optional legend, and a theme-aware tooltip. Config-driven colors via --chart tokens.

Radial Chart

radial-chart

Recharts radial gauge on the shadcn ChartContainer: a single value plotted as a proportional ring with a muted track and a centered percentage plus caption. Ideal for progress, targets, and completion rates.