flint-chart: a visualization intermediate language that lets AI agents generate polished charts via semantic specifications

What it solves

Flint addresses the difficulty AI agents have when creating polished data visualizations. Instead of requiring agents to write verbose, complex configurations for scales, axes, and layouts—which are prone to error—Flint provides a compact intermediate language. This allows agents to specify what to visualize rather than how to configure every pixel, ensuring the resulting charts are professional and accurate.

How it works

Flint acts as a compiler that takes a simple, human-editable chart specification and transforms it into a native specification for popular rendering libraries. It uses over 70 semantic types (e.g., Price, Country, Temperature) to understand the nature of the data and automatically derives the optimal layout, spacing, and labels based on data cardinality and canvas constraints. It currently supports three major backends: Vega-Lite, ECharts, and Chart.js.

Who it’s for

• AI Agent Developers: Who want their agents to generate reliable, high-quality charts without hallucinating complex config settings.
• Frontend Developers: Who need a flexible way to generate charts across different rendering libraries using a single input format.
• MCP Users: Those using Model Context Protocol clients who want agents to create and render interactive charts directly within a chat interface.

Highlights

• Semantic Understanding: Uses 70+ semantic types to automate chart styling and layout.
• Multi-Backend Support: Compiles a single input into Vega-Lite, ECharts, or Chart.js specs.
• MCP Server: Includes a dedicated server (flint-chart-mcp) for seamless agent integration in MCP-capable environments.
• Automatic Layout: Dynamically adapts marks, legends, and sizing based on the data and chart design.