This server enables AI agents to generate charts and dashboard cards as images directly from structured data or natural language.
render_chart: Generate an inline chart image from a Chart.js-style JSON spec (type, labels, datasets). Supports line, bar, pie, doughnut, radar, and polarArea.
render_chart_url: Same as above, but returns a stable CDN URL for embedding in HTML or emails.
render_chart_ai: Create a chart from a plain-English description and optional raw data (JSON or CSV); the AI builds the spec automatically. (Requires a Pro/Business API key.)
render_card: Render a full dashboard card with header, KPI strip, footer, and custom theme from a JSON spec.
list_chart_output_examples / get_chart_example: Browse and retrieve built-in example specs to use as templates.
Output formats: PNG (default), JPEG, WebP, SVG (where applicable). Width, height, and dataset styling (colors, border radius) are configurable.
Free tier: 500 renders included with a free API key.
Allows rendering charts as PNG, SVG, or WebP images using Chart.js specifications, with tools for generating charts from natural language descriptions and data.
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type @ followed by the MCP server name and your instructions, e.g., "@Chart-Output MCP Server show me a bar chart of monthly sales data"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Render charts as PNG, SVG, or WebP images directly from Claude, Cursor, Windsurf, or any MCP-compatible AI agent.
Ask your AI: "Generate a bar chart showing Q1–Q4 revenue" — it calls Chart-Output and returns the image inline.
Ask your AI agent to generate a chart. This is what comes back.
(If the image does not load in your viewer, open the file on GitHub.)
Related MCP server: Quick Chart MCP Server
Ready-to-use chart configs in /examples.
Copy any file, swap in your data, POST to the API.
Add to your mcp.json:
{
"mcpServers": {
"chart-output": {
"command": "npx",
"args": ["@chartoutput/mcp"],
"env": {
"CHART_OUTPUT_API_KEY": "pk_test_YOUR_KEY"
}
}
}
}Get a free API key at chart-output.com — no credit card required.
Tool | Description |
| Shipped example spec ids — use before hand-writing |
| Return full |
| Chart.js-style labels/datasets → inline image (optional |
| Same as |
| Full card composition JSON → inline image (header, KPI strip, footer, theme, |
| Same full card composition as |
| Natural language + data → image (Pro/Business key required) |
MCP resources also expose the same files as application/json at chart-output://examples/<id> (e.g. mrr-breakdown). Prefer get_chart_example or a resource read over guessing the schema.
Once installed, just ask your AI agent:
"Create a line chart showing monthly active users growing from 12k in January to 28k in December"
The agent calls render_chart, render_card, or render_chart_ai and returns
the image directly in chat. No code required. Use render_card for branded dashboard layouts (dark theme, KPI row, footer), or render_card_url when you need an openable/shareable link.
Sign up at chart-output.com
Go to Dashboard → API Keys → Create key
Add it to your mcp.json as shown above
Free trial includes 500 renders. No credit card required.
Registry listing and quality card:
Unclaimed servers have limited discoverability.
If you are the server author, to access and configure the admin panel.
Renders interactive Chart.js charts and dashboards inline in AI conversations.
Generate images, GIFs, and PDFs from HTML, URLs, or templates — from your AI agent.
Provide real-time data querying and visualization by integrating Tako with your agents. Generate o…
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/lavondev/chart-output-mcp'
If you have feedback or need assistance with the MCP directory API, please join our Discord server