How do I change Legend color in a Recharts pie chart?

Question

I'm rendering a pie chart from recharts (screenshot of the chart here). I want every legend to be in a different color, but can't get it to work with the fill prop.

My code:

const COLORS = ['#000', '#3095B4', '#E6E6E6'];

<PieChart width={730} height={300}>
<Pie
    data={data}
    innerRadius="90%"
    outerRadius="100%"
    paddingAngle={0}
    dataKey="value"
    isAnimationActive={false}
>
    {data.map((entry, index) => {
        return (
            <Legend
                key={`cell-${index}`}
                fill={COLORS[index]}
            />
        );
    })}
</Pie>

How can I do it?

Answer 1

Based in your screenshot, You seems like to have different colors for every cells, not for legend. So, use

<Cell key={`cell-${index}`} fill={COLORS[index]} />

instead of legend in your code.