jiangmejiang123

Chart Skill — Development skill for Claude Code

Development community

Turn explanations into charts.

How to install Chart Skill

This entry records only its repository, not the path inside it, so there is no exact command to give. Open jiangmejiang123/chart-skill and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What Chart Skill does

Turn explanations into charts. An agent skill for Claude Code and any AGENTS.md-aware harness: 12 chart types (flowchart, mindmap, gantt, sankey, treemap, network...) from one command, automatic CJK/Chinese/Japanese font detection, matplotlib + graphviz under the hood.

Alternatives in Development

  • Prompt Net Requests — I want to enhance the AsyncPlaywrightCrawlerStrategy to optionally capture network requests and console messag 85.8k ★
  • Offline — PUA 离线模式 — 关闭所有联网反馈/排行榜上报,保留本地 PUA 行为 19.5k ★
  • Add Chart — Renamed → /portaljs-add-chart 2.3k ★

README

chart-skill

**English** · [中文](README.zh-CN.md) · [日本語](README.ja.md)

**Same question. Two answers.**

![Same prompt, same model, same workspace](examples/chat/compare-before-after.png)

Left: **25 seconds**, seven numbered paragraphs — the reader has to prioritise them. Right: **28 seconds**, one flowchart — branches, exits and the next step are all on the canvas.

**Nearly the same time.** The difference is what the model decides to do with those three seconds. It doesn't change what the model *can* do. It changes what it *chooses* to do.

This is an **agent skill**, not a charting library. Drop it into your agent's skill directory and it starts choosing diagrams over paragraphs — with hard rules for both directions: when it *must* draw, and when it *must not*.


What it actually changes

Prose is **linear**: you have to read to the end to know what matters, then rebuild the structure in your head. A diagram is **parallel**: structure, proportion, flow and order are visible at once.

So the question is never "can this be drawn" but:

**Is this information already shaped like a diagram?**

If yes, drawing it saves the reader half the work. If no, drawing it is just decoration. This skill encodes both halves — and the second one (restraint) is the part most tools miss.

What a conversation looks like after installing it

Triage: five paragraphs → one flowchart

**Before** — the reader has to sort out the priorities:

This error usually has three causes. First, the port is taken… second, the config path is wrong… third, dependencies are missing… the first is the most common…

**After**:

![Triaging a 500](examples/chat/1-flow.png)

Scheduling: "about six weeks" → a gantt you can argue with

![Delivery plan](examples/chat/3-gantt.png)

Structure: one breathless sentence → a mind map

![Service anatomy](examples/chat/4-mind.png)


But the hard part isn't drawing. It's **knowing when not to**.

Three numbers or fewer: use a table. Two s