Microcharts

What the microcharts MCP server does

The microcharts MCP server gives an AI assistant a direct way to work with the @microcharts/react chart library. It helps the assistant select an appropriate chart for a question, inspect the exact API for that chart, and produce a rendered result rather than relying only on documentation text.

The underlying library contains 106 chart types designed for compact interface locations such as sentences, table cells, KPI cards, tabs, and AI responses. Charts use data-driven React components, and the library provides static and interactive imports. The MCP server focuses on discovery, API lookup, and rendering; the supplied material does not describe it as a general-purpose React code execution environment.

How it works

The server runs on the developer's machine as a local Model Context Protocol process using standard input and output. An MCP-compatible assistant sends tool calls to the process, which uses the microcharts library to answer them.

Its three tools cover separate stages of chart selection and use:

• find helps identify a chart type that answers a stated question.
• get returns the selected chart's exact props and a sample that is ready to render.
• render creates a self-contained SVG and includes the generated alternative text.

This arrangement lets an assistant move from a natural-language requirement to a documented component shape and then to visual output. The rendered chart's accessible description comes from the chart data, matching the accessibility behavior documented for the React library.

Setup and configuration

Run the package with npx using the package's executable configuration:

{
  "mcpServers": {
    "microcharts": {
      "command": "npx",
      "args": ["-y", "@microcharts/mcp"]
    }
  }
}

The README describes a local stdio process and does not specify required environment variables, a remote endpoint, authentication, or additional configuration. The package used by the process is @microcharts/mcp; the chart implementation it accesses is @microcharts/react.

Tools and capabilities

The microcharts MCP server supports chart discovery, precise API inspection, and SVG generation. find is useful when the assistant knows the information need but not the chart name. get is appropriate when the assistant needs the import details, accepted properties, data shape, and an example. render is useful for obtaining a standalone SVG representation with alternative text attached.

The chart library itself uses small, individual chart imports and supports static rendering without client JavaScript. Those library characteristics can help when the assistant is producing React UI, but the excerpt does not state that the MCP tools install components into an application or modify project files.

Limitations and notes

The README says the library has been tested and used in production but not across every stack and edge case. That qualification also matters when evaluating generated chart output in a particular React application.

The provided material documents stdio operation only. It does not identify named MCP clients, provide hosted operation, list authentication options, or define environment variables. It also does not describe tool-specific flags beyond the three tool names and their stated roles. Chart types intentionally excluded from the library include pie, needle gauges, battery, waffle, and violin charts; the documentation points to alternatives within the catalog.