Examples/

Dark Mode Toggle

Charts that respond to Tailwind dark mode. Same data, different aesthetic. Toggle and see.

Revenue Trend
JanFebMarAprMayJun4K6K8K10K
Categories
ABCD0100200300

Code

example.tsx
import { LineChart, BarChart } from "@chartts/react"

// Charts automatically respond to Tailwind dark: variants
<LineChart
  data={data}
  x="month"
  y="revenue"
  lineClassName="stroke-cyan-500 dark:stroke-cyan-400"
  axisClassName="text-zinc-600 dark:text-zinc-400"
/>
← All examples