mcpbeat Sign in

Prism Chart Agent Skill

| Use when asked to implement a chart, select a visualization type, or build a visualization for comparison data", "chart component for analytics"

809 tokens
context cost
the whole folder, loaded on every use
2
files
instructions only
0
copies elsewhere
how many repositories repackaged it
2679
stars on the repo
on the repository, not the skill itself

Install

one command, takes just this skill from the repository
npx skills add https://github.com/jeremylongshore/tons-of-skills-marketplace --skill prism-chart

What comes with it

275 bytes besides the instruction
.claude-plugin/plugin.json

The instruction itself

6 sections, as written by the author

prism-chart — Chart & Visualization Selection

Follow the output format defined in docs/output-kit.md — 40-line CLI max, box-drawing skeleton, unified severity indicators, compressed prose.

When to use

User needs a chart implementation, visualization type recommendation, or data display component.

Workflow

  • Identify data type from user request (time series, comparison, distribution, composition, relationship, etc.)
  • Search chart knowledge base:
   python3 -m prism_agent.uiux search --domain chart --query "{data_type}" --limit 3
  • Evaluate results for: data volume threshold, accessibility grade, interaction level
  • Output recommendation with library choice and accessibility fallback

Output format

┌─ Chart Recommendation — {data_type} ────────────────────────────────┐
│ Chart type:        {chart_type}                                      │
│ Library:           {library} (Chart.js / Recharts / D3 / Plotly)    │
│ Accessibility:     {grade} (AA / A / Below AA)                      │
│ Interaction level: {level} (static / hover / drill-down)            │
│ Data volume:       {threshold} (max recommended data points)        │
├─ Color guidance ────────────────────────────────────────────────────┤
│ {color_guidance}                                                     │
├─ Accessibility fallback ────────────────────────────────────────────┤
│ {fallback_description}                                               │
└──────────────────────────────────────────────────────────────────────┘

Anti-patterns

  • Never ignore data volume threshold — recommend aggregation if data exceeds it
  • Never skip accessibility fallback for charts graded below AA
  • Never choose a chart type based on visual appeal over data clarity
  • Never recommend a library without confirming it is compatible with the detected stack

Delivery

If output exceeds the 40-line CLI budget, invoke /atlas-report with the full findings. The HTML report is the output. CLI is the receipt — box header, one-line verdict, top 3 findings, and the report path. Never dump analysis to CLI.

How to use it

Copy the folder

Take jeremylongshore/prism-chart from the repository into ~/.claude/skills for personal use, or into .claude/skills inside a project.

Check the name does not clash

The agent identifies a skill by the name field in its header. Two skills with the same name cannot sit side by side — one of them will be ignored.