Tool Open source

TanStack Charts

TanStack Charts is a TypeScript visualization grammar for responsive, accessible, server-rendered application charts, built on granular D3 primitives. Chart definitions are framework-independent: marks consume arrays, objects, tuples, or iterables; channels describe visual encodings; and scale factories infer domains from those channels. Definitions compile into a renderer-neutral keyed scene that can be rendered through React, Preact, Vue, Solid, Svelte, Angular, Lit, Alpine, Octane, the vanilla DOM, static SVG, or an optional Canvas renderer. The system supports layered built-in marks, custom marks using the same scene protocol, responsive layout, automatic guide margins, themes, interaction, animation, accessibility, SVG server-side rendering, hydration, and export. Its marks, transforms, layouts, renderers, and chart-owned interactions are available through independent subpaths, with optional D3-backed capabilities remaining tree-shakeable. The repository documents an unreleased alpha line and says the latest published release is 0.16.0; alpha releases may contain breaking changes between minor versions.

View repository Visit site Mentioned in 1 video ↓

What TanStack Charts is used for

1 use taken from transcripts — each links to the moment in the video.

  • A typed visualization grammar that separates chart definitions from front-end rendering. One definition can target React, Vue, Svelte, Solid, static SVG, or Canvas while retaining D3 scales and layouts.

Videos mentioning TanStack Charts

1 in the library.