dashboardcn
1

Funnel Chart

PreviousNext

Step-by-step conversion with drop-off between steps and overall conversion.

1Visited pricing12,480100%
60.6% drop-off
2Started signup4,92039.4%
26.6% drop-off
3Verified email3,61028.9%
40.7% drop-off
4Created workspace2,14017.1%
80.7% drop-off
5Upgraded to Pro4123.3%
Overall conversion3.3%
import { FunnelChart } from "@/components/ui/funnel-chart"

const steps = [

Installation

pnpm dlx shadcn@latest add https://dashboardcn.com/r/funnel-chart.json

Usage

import { FunnelChart } from "@/components/ui/funnel-chart"

<FunnelChart
  steps={[
    { name: "Visited pricing", value: 12480 },
    { name: "Started signup", value: 4920 },
    { name: "Upgraded to Pro", value: 412 },
  ]}
/>