React dashboard components — API lookup, code generation, and prop validation for AI tools.
Connect Metricui to Claude, Cursor or any other MCP client and it stops being a tab you switch to. React dashboard components — API lookup, code generation, and prop validation for AI tools. The metricui mcp server is what makes that connection.
KPI cards, charts, tables, and layout — with built-in formatting, theming, data states, and zero config.
The toolset is worth reading before you wire it up, because it tells you what the integration is really for:
Component — What it doesFilterProvider — Context that wires all filter components. useMetricFilters() hookAccessibility — prefers-reduced-motion, focus-visible rings, ARIA attributes on charts, keyboard-accessible drill-downs. [DocsCharts — The Charts tool exposed by this serverLayout — The Layout tool exposed by this serverFilters — The Filters tool exposed by this serverInstallation goes through your MCP client rather than a global install: point it at @metricui/mcp-server on npm and it is fetched when the client starts. The copy-paste blocks for Claude Desktop, Claude Code and Cursor are further down this page.
This sits in the developer tooling group, where several servers overlap in what they claim to do but differ sharply once you actually set them up. Metricui's toolset — Component, FilterProvider, Accessibility and 3 more — is a fair guide to whether it matches your workflow. It is maintained by mpmcgowen; worth a glance at recent repository activity before you build anything load-bearing on it.
This entry was verified against Metricui's own documentation before publication; SyncDev keeps the directory reviewed rather than auto-generated.
| Tool | What it does |
|---|---|
| Component | What it does |
| FilterProvider | Context that wires all filter components. useMetricFilters() hook |
| Accessibility | prefers-reduced-motion, focus-visible rings, ARIA attributes on charts, keyboard-accessible drill-downs. [Docs →](https://metricui.com/docs/guides/accessibility) |
| Charts | The Charts tool exposed by this server. |
| Layout | The Layout tool exposed by this server. |
| Filters | The Filters tool exposed by this server. |
{
"mcpServers": {
"metricui": {
"command": "npx",
"args": ["-y", "@metricui/mcp-server"]
}
}
}Add to claude_desktop_config.json, then restart Claude Desktop.
Kill hallucinated APIs — version-accurate, up-to-date library documentation injected straight into context.
Microsoft's official browser automation server — drive a real browser through the accessibility tree, no screenshots needed.
GitHub's official server — repos, issues, pull requests, Actions and code security, straight from your assistant.
Issue tracking at the speed of conversation — Linear's official hosted server with OAuth and zero install.
Local repository surgery — status, diffs, commits, branches and history for any repo on disk.
Timezone sanity for AI — current time anywhere and correct conversions, without the model doing date math.