Semiotic MCP Server
Render charts, validate configs, and get chart recommendations from a React data-viz library via MCP.
Add to your client
Copy the config for your MCP client and paste it into its config file.
npx semiotic-mcpPaste into ~/Library/Application Support/Claude/claude_desktop_config.json
{
"mcpServers": {
"semiotic-mcp-server": {
"command": "npx",
"args": [
"semiotic-mcp"
]
}
}
}Step-by-step guides: Add to Claude Desktop · Add to Cursor · Add to Windsurf
Before you start
- Node.js with npx available
- An MCP client (e.g. Claude Desktop, Cursor, Windsurf, Cline)
About Semiotic MCP Server
Semiotic ships an MCP server that turns its React data-visualization library into agent-callable tools. AI coding assistants can render charts to SVG, look up prop schemas for any of 47 chart types, get chart/dashboard recommendations from sample data, and diagnose or repair chart configurations — so generated chart code is correct on the first try. The server runs locally over stdio (no auth) and also offers a stateless HTTP mode for inspectors, web clients, and ChatGPT Apps SDK experiments.
Tools & capabilities (13)
renderChartRender a Semiotic chart to static SVG. Supports components from getSchema marked [renderable], e.g. { component: "LineChart", props: { data: [...], xAccessor: "x", yAccessor: "y" } }. Returns the SVG string plus a "Render evidence" JSON block (mark counts by scene type, resolved axis domains, empty flag, annotation count, accessible name) so agents can verify the chart drew data marks, or validation errors with fix suggestions.
renderInteractiveChartRender a static-data chart as a ChatGPT Apps widget. Uses the same Semiotic server render path as renderChart, then hydrates an iframe UI with fit, zoom, data, hover, and render-evidence controls.
getSchemaReturn the prop schema for a specific component, e.g. { component: "LineChart" }, or omit component to list all 47 chart schemas. Components marked [renderable] are available through renderChart; realtime charts require a browser/live environment.
suggestChartLegacy sample-row recommender. Pass { data: [{...}, ...] } with 1-5 sample objects plus optional broad intent/capability filters.
suggestChartsCapability-based recommender for bounded row data. Returns ranked chart suggestions with scores, reasons, caveats, import paths, and ready-to-use props.
suggestStreamChartsRecommend realtime charts from a stream schema, throughput, and retention hints.
suggestDashboardBuild a multi-panel dashboard suggestion that covers distinct analytical intents.
suggestStretchChartsRecommend audience-literacy stretch picks from an AudienceProfile.
repairChartConfigCheck whether a requested chart fits a dataset and return ranked alternatives when it does not.
interrogateChartReturn a statistical summary and chart-aware context for answering natural-language questions with optional annotations.
diagnoseConfigCheck a chart configuration for common problems — empty data, bad dimensions, missing accessors, wrong data shape, and more. Returns a human-readable diagnostic report with actionable fixes.
reportIssueGenerate a pre-filled GitHub issue URL for bug reports or feature requests. Pass { title, body, labels: ["bug"] }; returns a URL the user can open to submit.
applyThemeList named theme presets or return ThemeProvider/CSS/token usage for a preset such as { name: "tufte" }.
What this server can do
Semiotic MCP Server provides tools for these capabilities — tap one to see every MCP server that does the same:
When to use it
- Let an AI coding assistant generate correct Semiotic chart code on the first try by reading schemas and validating props before rendering.
- Render data to static SVG charts (line, bar, scatter, network, geo, and more) directly from an MCP client.
- Get ranked chart or dashboard recommendations from sample data, including import paths and ready-to-use props.
- Diagnose and repair broken chart configurations with actionable fixes.
- Power ChatGPT Apps SDK experiments via the HTTP mode and renderInteractiveChart widget.
Security notes
No API keys or authentication required; the server runs locally via stdio. HTTP mode is read-only and stateless; for production HTTP deployments use MCP_ALLOWED_HOSTS for host-header allowlisting.
Semiotic MCP Server FAQ
Does it require an API key or authentication?
No. The server runs locally via stdio with no API keys or authentication required.
How do I install and run it?
Add it to your MCP client config with command "npx" and args ["semiotic-mcp"]. It is distributed as the semiotic-mcp binary in the semiotic npm package and launched via npx.
Is there an HTTP transport?
Yes. Run `npx semiotic-mcp --http --port 3001` for inspectors, web clients, and ChatGPT Apps SDK experiments. Since 3.7.2 HTTP mode is stateless (a fresh read-only server per request) so it can autoscale on serverless hosts.
What can the server actually do?
It renders charts to SVG, returns prop schemas for 47 chart types, recommends charts/dashboards from data, and diagnoses or repairs chart configs. It also exposes MCP resources (schemas, component index, behavior contracts, system prompt, examples) and prompts for building and debugging charts.
Is it official?
Yes. It is published in the nteract/semiotic repository (mcp-name io.github.nteract/semiotic) and listed in the official MCP Registry.
Alternatives to Semiotic MCP Server
Compare all alternatives →
Official MCP server providing persistent, file-backed knowledge-graph memory across sessions.
Structured step-by-step reasoning tool for breaking problems into revisable thought sequences.
Fully managed remote server for AWS docs, blogs, What's-New and Well-Architected guidance — no key.
Compare Semiotic MCP Server with: