// design · microsoft/flint-chart

flint-chart

flint-chart est un projet de design open source, créé par microsoft (microsoft/flint-chart sur GitHub). Il compte 4 351 étoiles sur GitHub et 245 forks, il est publié sous la licence MIT et a été mis à jour pour la dernière fois sur GitHub le 8 octobre 2026.

Flint compiles semantic chart specs into Vega-Lite, ECharts, Chart.js, Plotly — or native Excel charts

★ 4,4 k étoiles⑂ 245 forksMITmis à jour oct. 2026

Voir sur GitHub ↗Official site ↗

▦ visuel — le README de ce projet ne contient aucune capture intégrable,
voici donc un emplacement réservé. Le guide ci-dessous est complet malgré tout.

// détails du projet

Détails du projet

Dépôt: microsoft/flint-chart
Étoiles GitHub: 4 351
Forks: 245
Licence: MIT
Dernière mise à jour sur GitHub: 8 octobre 2026
Catégorie: Design
Type de fiche: Guide d'installation complet
Site officiel: Official site

// fonctionnement

Comment ça marche

Frame your data semantically
Identify the semantic types behind your fields — measures like Price or Temperature, dimensions like Country or Rank.
Install the library
Add flint-chart from npm (or connect the hosted/npx MCP server for agent use).
Write a semantic spec
Describe the chart in Flint's compact spec format rather than low-level chart options.
Compile and render
Assemble output for your target — Vega-Lite, ECharts, Chart.js, Plotly, or a native Excel chart — and iterate on the theme.

// fonctionnalités

Pourquoi on l'adore

Semantic typing system

70+ semantic types let the compiler choose sensible encodings, scales, and formatting for your data.

Five output targets

Compile one spec to Vega-Lite, ECharts, Chart.js, Plotly, or native editable Excel charts.

Formal visual themes

Ten built-in presets plus custom ThemeSpec definitions with inheritance for house styles.

MCP server for agents

`npx flint-chart-mcp` (or the hosted endpoint) lets agents create, validate, and render charts, including PNG/SVG output.

Automatic layout

Layout and labeling are handled by the compiler rather than hand-tuned per chart.

Compact specs

Specifications stay short and data-focused compared with hand-writing Vega-Lite or ECharts options.

// lancez-le

Lancez-le vous-même

Clone the repository
Clone the project and enter its directory (library users can install from npm instead).
```
git clone https://github.com/microsoft/flint-chart.git
cd flint-chart
```
Install the library
Add Flint Chart to your Node/TypeScript project.
```
npm install flint-chart
```

Compile your first chart

Assemble a chart spec into Vega-Lite (or another target) as shown in the README examples.

import { assembleVegaLite } from 'flint-chart'
// build a semantic spec and pass it to assembleVegaLite({...}) — see README examples

// cas d'usage

Ce que vous pouvez créer

Generate consistent, publication-style charts from data in a TypeScript app
Let an AI agent produce validated charts through the Flint MCP server
Export analyst charts as native, editable Excel objects instead of images
Enforce one visual identity across dashboards via a shared ThemeSpec

// faq

Questions fréquentes

Who maintains Flint Chart?

Microsoft Research publishes Flint Chart (the hosted MCP demo is at flint.data-formulator.ai).

Is Flint Chart free?

Yes, MIT-licensed, including the npm library and the local MCP server.

Does it need a paid API key?

No. The library and MCP server run locally; agents connecting to them use their own model access.

How does it compare to writing Vega-Lite directly?

Vega-Lite is one of Flint's output targets. Flint adds a semantic layer on top — types, themes, and layout — so one compact spec can target Vega-Lite, ECharts, Chart.js, Plotly, or Excel.

How do I get started?

Les autres projets de la catégorie Design avec le plus d'étoiles du catalogue LibreAI — la sélection réaliste d'alternatives si flint-chart ne vous convient pas.

Excalidraw★ 134,0 k
Excalidraw — the virtual whiteboard with the hand-drawn look: infinite canvas, real-time collaboration and end-to-end encrypted sharing, MIT-licensed
Screenshot To Code★ 80,0 k
Drop in a screenshot and convert it to clean code (HTML/Tailwind/React/Vue)
archify★ 79,8 k
Turn any idea, plan or codebase into a beautiful interactive architecture diagram — an agent skill
AFFiNE★ 73,2 k
There can be more than Notion and Miro. AFFiNE(pronounced [ə‘fain]) is a next-gen knowledge base that brings planning, sorting and creating all together. Pri…
draw.io Desktop★ 63,6 k
draw.io Desktop — the official offline desktop app for diagrams.net: flowcharts, architecture diagrams and wireframes in an Electron app that never sends your diagram data anywhere, GPL-3.0

// plus en design

Plus en Design

Projets de la catégorie Design proches dans le catalogue, les plus proches en étoiles de flint-chart — continuez à explorer de part et d'autre.

mirotalk★ 4,8 k
🚀 Open-source, self-hosted P2P WebRTC video conferencing for fast, private real-time communication. Create browser-based meeting rooms with no downloads or t…
SwanLab★ 4,2 k
⚡️SwanLab - an open-source, modern-design AI training tracking and visualization tool. Supports Cloud / Self-hosted use. Integrated with PyTorch / Transforme…
poster-design★ 4,9 k
Open-source online poster and image designer with a full editor, admin backend, and built-in AI tools
sumo★ 4,2 k
Eclipse SUMO is an open source, highly portable, microscopic and continuous traffic simulation package designed to handle large networks. It allows for inter…
rallly★ 5,3 k
Rallly is an open-source scheduling and collaboration tool designed to make organizing events and meetings easier.
dembrandt★ 3,6 k
Extract any website's design system — logo, colours, typography and tokens — in one command.

Obtenir flint-chart

Gratuit et ouvert : récupérez le code source, mettez une étoile au dépôt et commencez à créer.

Voir sur GitHub ↗← Plus d'outils design