React Radar Chart with Legend

React Radar Chart with Legend preview

Name those colors. This React radar chart adds a legend to identify what each polygon color represents—essential when comparing multiple series since the polygon shapes alone don't tell users what they're looking at. Built with Recharts and shadcn/ui using ChartLegend, the color-coded legend maps directly to your chartConfig labels. Position it below or beside the chart to avoid blocking the data visualization.

Install with AI

If you've connected the shadcn.io MCP server to Claude Code, Cursor, Windsurf, or any MCP-ready AI editor, prompt your agent to install this chart for you — no copy-paste, no CLI:

use shadcnio to install the radar-legend chart into my project

Related Components

FAQ