ggsvelte is a fast, agent-native implementation of the layered grammar of graphics

Bar chart of cold-mount time for a 3-series by 1,000-point area chart: ggsvelte 8 ms, ECharts 15.2 ms, LayerCake 10.9 ms, TanStack 18.1 ms, Unovis 84.1 ms, SveltePlot 272.1 ms. Lower is better.

Why ggsvelte?

Capability	ggsvelte	TanStack	SveltePlot	Unovis	LayerCake
Bundle size Min+gzip, 1k scatter app	partial 103 KB	yes 57 KB	partial 109 KB	yes 80 KB	yes 41 KB
API stability Pre-1.0: minors can still break	partial v0.41.0	partial v0.14.0	partial v0.14.2	yes v1.6.7	yes v10.0.3
Headless server-side SVG data → SVG string, no DOM	yes	yes	no	no	partial opt-in
Portable JSON spec + schema	yes	no	no	no	no
CLI validator + renderer	yes	no	no	no	no
Agent skill	yes	yes	no	no	no
Automatic temporal detection	yes	no	partial Some	no	no
Built-in interactions Tooltip, select, zoom, link	yes	yes	partial Some	partial Some	no bring your own
ggplot2 API	yes	no	no	no	no
Scale, axis & coord control	yes	yes	yes	yes	partial d3

Svelte for builders, JSON for embedded agents.

Human-agent pairs get Svelte components for clarity. Embedded agents can use JSON specs for interactive charts on demand.

<script lang="ts">
  import { GeomJitter, GeomSmooth, GGPlot, GuideLegend, Inspect, Labs } from "@ggsvelte/svelte";
  import { palmerPenguins } from "@ggsvelte/svelte/data";
</script>

<GGPlot
  data={palmerPenguins}
  aes={{ x: "flipperLengthMm", y: "bodyMassG", color: "species" }}
  width={640}
  height={400}
>
  <GeomJitter alpha={0.88} />
  <GeomSmooth method="loess" span={0.75} degree={1} se={false} />
  <GuideLegend channel="color" focus />
  <Labs x="Flipper length mm" y="Body mass g" color="species" />
  <Inspect mode="xy" pin maxDistance={24} />
</GGPlot>

Docs

Getting started: Install and render a chart
Themes: Built-in chart themes
Palettes: Categorical palettes and sequential scales
Headless SVG: No-DOM renderer and CLI