Solid.js Charts

Native Solid.js components for 65+ chart types. Fine-grained reactivity means charts update without re-rendering. Tailwind CSS, TypeScript, and SolidStart SSR support out of the box.

$npm install @chartts/solid
example.tsx
import { LineChart } from "@chartts/solid"
import { createSignal } from "solid-js"

export function Dashboard() {
  const [data] = createSignal([
    { month: "Jan", revenue: 4200 },
    { month: "Feb", revenue: 5800 },
    { month: "Mar", revenue: 7100 },
  ])

  return (
    <LineChart
      data={data()}
      x="month"
      y="revenue"
      class="h-64"
      lineClass="stroke-cyan-400"
    />
  )
}

Features

Fine-grained reactivity (no VDOM diffing)
Native Solid.js components
Tailwind CSS integration
Full TypeScript support
SolidStart SSR support
65+ chart types
Under 15kb gzipped
Read the DocsSee DemosExamples