Chart Lab

Interactive

Tune supported props, inspect generated code, and verify accessibility without executing arbitrary user scripts.

tsx

import { LineChart } from "@kamod-ch/charts/line";

<LineChart
  data={data}
  xKey="month"
  xScale="point"
  series={[
    { key: "revenue", label: "Primary", color: "var(--chart-1)" },
    { key: "costs", label: "Secondary", color: "var(--chart-2)" },
  ]}
  height={320}
  initialWidth={720}
  responsive={true}
  showGrid={true}
  showLegend={true}
  tooltip={true}
  curve="monotoneX"
  connectNulls={false}
  showPoints={"auto"}
  title="Playground chart"
/>