Guide · Agent skill
How to use the Chart Creation Foundations agent skill
Updated · written with AI from the project's own documentation and checked against our catalogue data
Chart Creation Foundations (hive.chart-creation-foundations) is an agent skill: a SKILL.md file that teaches an AI agent when a chart is worth showing, which chart library to use, and how to render it with the chart_render tool. It is written for people who want charts produced automatically in chat, and it works only where the chart_* tools exist. After this guide you will know how to install the skill, how to ask for charts in plain language, and what the agent should produce.
Quick start
- 1Download the ZIP. Get the skill ZIP from the directory page. It contains SKILL.md.
- 2Unzip into a skills folder. Extract it into ~/.claude/skills/ for personal use, or into a project's .claude/skills/ folder.
- 3Or upload in the Claude apps. Go to Settings → Capabilities → Skills and upload the ZIP instead.
- 4Confirm chart_* tools are available. The skill needs chart_render from the Hive runtime. Without it the agent cannot draw charts.
- 5Ask for a chart in plain language. Name the data and the question, for example a trend or a comparison.
- 6Open the chart and download the PNG. The chart appears in the chat bubble, and the download link comes from the tool result's file_url.
What the skill makes the agent do
The skill is required reading whenever a chart_* tool is available. Its main rule is that the agent puts a chart in the conversation by calling chart_render once. The chat reads the returned spec and draws the chart live in the message, and the result includes a file_url that links to a downloadable PNG saved in the queen session directory.
The skill also tells the agent not to write image markdown such as  by hand, because the tool result drives the interface.
- Chooses between ECharts for data charts and Mermaid for structural diagrams
- Applies a restrained visual style: no 3D effects, no chartjunk, one message per chart
- Uses the canonical spec patterns for 12 common chart types
- Decides when text or a table is better than a chart
Install the skill: ZIP download or Claude apps upload
Download the skill ZIP from the directory page. The skill is a single file, SKILL.md. To install it for Claude Code, unzip it into your personal skills folder ~/.claude/skills/, or into a project's .claude/skills/ folder if you want it limited to one project.
In the Claude apps, you can instead upload the ZIP under Settings → Capabilities → Skills.
- Personal install: unzip into ~/.claude/skills/
- Project install: unzip into the project's .claude/skills/ folder
- Claude apps: Settings → Capabilities → Skills, then upload the ZIP
Check the requirements before you rely on it
The skill only guides the agent. It does not provide the chart tools. It needs the chart_render tool (the chart_* tools) to be available in the Hive runtime. ECharts and Mermaid rendering are supplied by the Hive renderer, which is not included in this file.
If chart_* tools are not installed, the skill has nothing to drive, and the agent will need to answer in prose or tables instead. The skill does not run scripts and does not use the network.
- Required: chart_render (chart_* tools) available in the Hive runtime
- Provided by the Hive renderer, not this file: ECharts and Mermaid rendering
- Runs scripts: no
- Uses network: no
How to trigger the skill with natural requests
You do not need special syntax. Ask for the chart the way you would ask a colleague, and say what the chart should show. The skill decides whether a chart fits your data, so a request for a single figure may get a sentence rather than a graphic.
Good requests name the data and the question. Charts suit trends over time, comparisons across categories, distributions, hierarchies, flows and geographic data. Requests for flowcharts, sequence diagrams or architecture diagrams are routed to Mermaid.
- Trend: 'Chart monthly signups for the last year and show the trend.'
- Comparison: 'Compare Q4 revenue by region as a bar chart, sorted high to low.'
- Structure: 'Draw a sequence diagram of the checkout flow from this spec.'
- Single number: 'What was revenue last quarter?' (expect a sentence, not a chart)
What a chart_render call looks like
The skill gives the agent a canonical pattern. The call below is shortened from the skill's example. The spec follows ECharts option format, and the title goes inside the chart in option.title.text. The skill tells the agent not to set series colours, grid or title styling, because the Hive ECharts theme applies them.
The result includes spec, file_path, file_url, width, height, dpi and bytes. The file_url is the download link, and the chat shows it automatically.
- Set the title in the spec, not in the message body
- Do not override the palette, grid or title style
- Use one chart per message or per chart_render call
chart_render(kind="echarts", spec={"title": {"text": "Q4 revenue by region", "left": "center"}, "xAxis": {"type": "category", "data": ["NA", "EU", "APAC", "LATAM"]}, "series": [{"type": "bar", "data": [12.4, 8.7, 5.3, 2.1]}]}, title="q4-revenue-by-region", width=1600, height=900, dpi=300)Safety notes and when not to chart
The skill itself contains only guidance. It runs no scripts and makes no network calls. Read it before installing, as you would any file that shapes an agent's behaviour.
The skill also says not to chart noisy or incomplete data where a chart could mislead. In that case the agent should describe the takeaway in prose. Missing values should appear as a gap labelled (N/A), not as a zero-length bar.
- Noisy or incomplete data: describe it in prose instead
- Bar and area charts start at zero so they do not mislead
- Put footnotes and sources in the message, not inside the chart
What people use it for
- Analysts producing trend or comparison charts from data already in a conversation
- Founders or finance staff preparing slide-ready charts with a restrained style
- Technical writers rendering flowcharts, sequence diagrams or architecture diagrams from a text spec
Frequently asked questions
How do I install the Chart Creation Foundations skill?
Download the skill ZIP from the directory page and unzip it into ~/.claude/skills/ for personal use, or into a project's .claude/skills/ folder. In the Claude apps, upload the ZIP under Settings → Capabilities → Skills.
What do I need to run it?
The skill needs the chart_render tool (the chart_* tools) available in the Hive runtime. ECharts and Mermaid rendering come from the Hive renderer, which is not included in the file. The skill itself runs no scripts and uses no network.
Is the skill free, and what is its licence?
The item is licensed under Apache-2.0. The source does not state pricing, so check the directory page for any cost details.
Why is my chart not showing up?
The skill only guides the agent. If the chart_* tools are not installed in your runtime, chart_render cannot run and no chart appears. Confirm the tools are available, then ask again with a clear data question.
Does it work with ECharts and Mermaid?
Yes. The skill chooses ECharts (kind echarts) for numbers over categories or time, and Mermaid (kind mermaid) for structure such as flowcharts, sequence diagrams and architecture diagrams.
Will the agent always make a chart?
No. The skill says a chart should only appear when it shows something prose cannot. A single number is better as a sentence, a short ranking as a table, and noisy data as a prose description.
New agent skills, repos and AI tools — every week
The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.
Our verdict
Use this skill if you are working in an environment with chart_* tools and want charts that appear in chat with a downloadable PNG, styled plainly. Pick something else if you only need a single number or a short ranking, or if your runtime does not provide chart_render, since the skill only guides its use.
Download the skill