
Flint Chart Author
Use when: the user asks to make or render charts with flint-chart, visualize tabular...
Install
npx skills add microsoft/flint-chart --skill flint-chart-author -g -a claude-code -y- Repository
- microsoft/flint-chart4.5k
- Category
- AI and agents
- Updated
- 3d ago
- License
- MIT
- Context cost
- Mediumabout 3,000 tokens
- Runs scripts
- No, instructions only
What it does
Use when: the user asks to make or render charts with flint-chart, visualize tabular data, generate a ChartAssemblyInput, validate/render through MCP, or add Flint to a JS/TS project. Author the semantic spec, transform data before Flint when needed, install/import Flint only when executable code is needed, and reserve backend-specific style tweaks for after compiling from Flint.
flint-chart: authoring and using a chart spec
What you produce (and what you do NOT)
Your output is the spec: the chart_spec and semantic_types of a
ChartAssemblyInput. You reference data columns by name. The host
passes the resulting input to assembleVegaLite, assembleECharts,
or assembleChartjs to get a backend spec.
You write the input spec, not the output spec. And critically:
- DO emit
chart_spec(chart type, channel→field mapping, properties) andsemantic_types(field → semantic type). - DO add
interaction_specwhen the user asks for behaviour (highlight, legend toggle, pan and zoom, brush), asks for an interactive chart, or the session's goal is to explore the data. List presets by name; see "Interactions", and load theflint-interaction-authorskill for an intent, an interactive chart with nothing named, or a combination. - Reference columns by name. How
dataitself gets bound depends on the situation, a URL, a host-side variable, or embedded rows (see "How data gets bound"). Embedding is fine for small tables; just don't re-serialize a large dataset by hand, since that risks truncation and silent value corruption and wastes tokens. - Transform data before Flint. If the requested chart needs aggregation, filtering, joins, pivots, derived columns, or long/wide reshaping beyond Flint's built-in static-series fold, use a coding, notebook, SQL, or data tool first. Then author the Flint spec against the transformed table.
- Style after Flint, only when needed. Author structure in Flint. For a
presentation tweak Flint does not express (a reference line, annotation, or
shaded band), use the Vega-Lite escape hatch, see "Post-Flint style
customization". Never feed edited Vega-Lite JSON back to
render_chart.
When the user wants more than a spec
First decide which workflow the user is asking for:

