Pie Chart

Flat-fill pie beside a legend. Each slice picks a tone from a fixed six-color palette.

  • Direct48%
  • Referral24%
  • Social18%
  • Search10%

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use
import { Chart4 } from "@/components/beste/piece/chart4";

<Chart4
  slices={[
    {
      "label": "Direct",
      "value": 48,
      "tone": "indigo"
    },
    {
      "label": "Referral",
      "value": 24,
      "tone": "emerald"
    },
    {
      "label": "Social",
      "value": 18,
      "tone": "amber"
    },
    {
      "label": "Search",
      "value": 10,
      "tone": "rose"
    }
  ]}
/>