Server-Side Rendered Charts

Chart.ts renders charts as SVG strings on the server. No browser, no Canvas, no JavaScript needed on the client. Charts appear instantly in the HTML response. Works with Next.js RSC, Remix loaders, Astro, and any SSR framework.

$npm install @chartts/core
example.tsx
// Next.js App Router (Server Component)
import { bar } from "@chartts/core"

export default async function Page() {
  const data = await db.query("SELECT month, revenue FROM sales")

  const svg = bar({
    data,
    x: "month",
    y: "revenue",
    width: 600,
    height: 300,
  })

  return (
    <div dangerouslySetInnerHTML={{ __html: svg }} />
  )
}
// Zero client JS. Chart is in the HTML response.

Features

Zero client-side JavaScript for static charts
Charts appear in initial HTML response
No layout shift (CLS = 0)
Works with React Server Components
Compatible with Remix, Astro, Nuxt, SvelteKit
Edge runtime compatible
SVG output for maximum compatibility
Read the DocsSee DemosExamples