Flint Chart Language

What does this agent do, and when should you use it?

Flint is a visualization intermediate language designed to express data fields and chart intent through compact semantic specifications. Its flint-chart TypeScript library accepts a shared ChartAssemblyInput and produces native Vega-Lite, ECharts, Chart.js, Plotly, or Excel output. The accompanying flint-chart-mcp server lets MCP-capable chat and coding clients create, validate, and render charts, returning interactive views, PNG or SVG images, or backend-native specifications. Layout, axes, labels, legends, and marks are derived from the data, chart design, canvas constraints, and an optional visual theme while the source specification remains human-editable. Teams can use a hosted HTTP MCP endpoint or run the server locally; the Python port is currently a source-only preview rather than a released package.

Flint reads rows embedded in data.values; in MCP workflows it can also read local JSON, CSV, or TSV files through data.url. Callers describe fields with more than 70 semantic_types, including Rank, Temperature, Price, and Country, while chart_spec supplies the chart type, encodings, and size. assembleVegaLite, assembleECharts, assembleChartjs, assemblePlotly, and assembleExcel compile that common input into each target's native object. A neighboring theme_spec can select one of ten presets or inherit a preset and override brand-specific decisions. Through flint-chart-mcp, an agent can select a template, validate the specification, render it, open an interactive chart view, return PNG/SVG output, or emit a backend-native specification.

1. A Claude user with remote custom connectors who wants to discover data and build a chart without leaving the conversation.
2. A TypeScript developer who needs to generate Vega-Lite, ECharts, Chart.js, or Plotly configurations from one input model.
3. An analytics team that wants the same dataset delivered as a web visualization or an editable native Excel chart.
4. A design-system team that wants to define a ThemeSpec once and reuse typography, color, legend, axis, and layout rules across a chart collection.
5. A user working with large local datasets who wants to run the MCP server locally and read JSON, CSV, or TSV files.
6. A data-product developer who wants chart sizing, spacing, labels, marks, and legends to adapt to cardinality and canvas constraints.

How do you install or deploy this agent?

Node.js 18 or newer is required. Install the library in a JavaScript or TypeScript project:

npm install flint-chart

Start the local server for agents and MCP clients:

npx -y flint-chart-mcp

For repository development, install the workspaces and run the documented checks:

git clone https://github.com/microsoft/flint-chart
cd flint-chart
npm install
npm run typecheck
npm run test
npm run build
npm run site

The demo site runs at http://localhost:5274/. No API credential is documented. The hosted MCP option requires network access, while local file inputs require the server to have permission to read those files.

How do you use this agent?

Pass data, semantic types, and a chart specification from TypeScript:

import { assembleVegaLite } from 'flint-chart';

const spec = assembleVegaLite({
  data: { values: myData },
  semantic_types: { weight: 'Quantity', mpg: 'Quantity', origin: 'Country' },
  chart_spec: {
    chartType: 'Scatter Plot',
    encodings: { x: { field: 'weight' }, y: { field: 'mpg' }, color: { field: 'origin' } },
    baseSize: { width: 400, height: 300 },
  },
});

Change the output backend without changing the input shape:

import { assembleECharts, assembleChartjs, assemblePlotly, assembleExcel } from 'flint-chart';

const echartsOption = assembleECharts(input);
const chartjsConfig = assembleChartjs(input);
const plotlyFigure = assemblePlotly(input);
const excelArtifact = assembleExcel(input);

A built-in visual theme can be selected alongside the chart specification:

const themedSpec = assembleVegaLite({
  ...input,
  theme_spec: 'economist',
});

A remote MCP client can connect directly to the hosted HTTP endpoint instead of starting a local process:

https://flint.data-formulator.ai/mcp

The documented remote clients are Claude custom connectors and GitHub Copilot in VS Code. The repository recommends a local MCP server for large datasets.

What are this agent's strengths and limitations?

How does this agent compare with similar options?

Key facts side by side with the most closely related agents.

How does FollowAgents rate this agent?

Recent releases

Latest entries from the project's GitHub Releases. Notes are quoted from upstream as written, not rewritten or tested by FollowAgents.

1. 0.5.1 2026-08-14
   Release notes excerpt

   flint-chart 0.5.1 Added - Plotly theme support — theme_spec now realizes onto Plotly figures. - Calendar Heatmap chart type for Vega-Lite. Titles - Headlines *and* decks are fitted instead of widening the graphic, with or without a theme. - Axis titles lie flat at the head of their own ruler; units are stated once. Grid and scales - Gridded axes round so the plot edge lands on a grid line, and the grid runs out to its number. - A chart is never left with no way to read a value — where nothing is printed, the grid returns. …

   View on GitHub ↗
2. 0.5 Flint 0.5: ThemeSpec 2026-08-06
   Release notes excerpt

   Flint 0.5 introduces ThemeSpec, a formal specification for applying a coherent design system across an entire chart library. Instead of requiring creators or agents to reproduce design guidance chart by chart, a ThemeSpec participates directly in compilation and adapts to the chart's semantics, data, cardinality, and available space. A ThemeSpec shapes compilation in three stages. Using resolved semantic information, it: - governs layout constraints and dynamics, including density, spacing, sizing, and stretch limits; …

   View on GitHub ↗
3. 0.4.0 Flint 0.4 2026-07-24
   Release notes excerpt

   Update 1: new plotly backend <img width="1240" height="829" alt="image" src="https://github.com/user-attachments/assets/a3514130-ad06-48e8-8458-9e828f6e50f2" /> Update 2: dynamic widget for chart type switch in the mcp server <img width="1090" height="466" alt="image" src="https://github.com/user-attachments/assets/3039761c-6d6c-456b-b6ab-66cf94c8069f" /> Update 3: Research paper Read it here, maybe also share and cite.. [https://arxiv.org/abs/2607.20775](https://arxiv.org/abs/2607.20775) Update 4: new Excel backend …

   View on GitHub ↗

FAQ