diff --git a/app/(app)/insights/components/burndown-chart.tsx b/app/(app)/insights/components/burndown-chart.tsx
new file mode 100644
index 0000000..14d355e
--- /dev/null
+++ b/app/(app)/insights/components/burndown-chart.tsx
@@ -0,0 +1,49 @@
+'use client'
+
+import {
+  LineChart,
+  Line,
+  XAxis,
+  YAxis,
+  Tooltip,
+  Legend,
+  ResponsiveContainer,
+} from 'recharts'
+import type { BurndownSprint } from '@/lib/insights/burndown'
+
+interface Props {
+  sprint: BurndownSprint
+}
+
+export function BurndownChart({ sprint }: Props) {
+  if (sprint.days.length === 0) {
+    return <p className="text-muted-foreground text-sm">Geen sprint-data</p>
+  }
+
+  return (
+    <div className="space-y-2">
+      <h3 className="text-sm font-medium text-foreground">
+        {sprint.productName} — {sprint.sprintGoal}
+      </h3>
+      <ResponsiveContainer width="100%" height={240}>
+        <LineChart data={sprint.days}>
+          <XAxis dataKey="day" tick={{ fontSize: 11 }} />
+          <YAxis allowDecimals={false} tick={{ fontSize: 11 }} />
+          <Tooltip />
+          <Legend />
+          <Line
+            dataKey="ideal"
+            stroke="var(--muted-foreground)"
+            strokeDasharray="4 4"
+            dot={false}
+          />
+          <Line
+            dataKey="remaining"
+            stroke="var(--status-in-progress)"
+            dot={false}
+          />
+        </LineChart>
+      </ResponsiveContainer>
+    </div>
+  )
+}