MCP Magic UI MCP Server

An MCP (Model Context Protocol) server for accessing and searching Magic UI components

Local serverstdio

What is the MCP Magic UI MCP server?

An MCP (Model Context Protocol) server for accessing and searching Magic UI components. That is what the mcp magic ui mcp server brings to an AI assistant: the same capability, reachable through the Model Context Protocol rather than a separate app or dashboard.

The short version

MCP Magic UI is a server that implements the Model Context Protocol (MCP) to provide access to Magic UI components. It fetches component data from the Magic UI GitHub repository, categorizes them, and makes them available through an MCP API. This allows AI assistants and other MCP clients to easily discover and use Magic UI components in their applications.

  • Component Discovery — Access all Magic UI components through MCP tools
  • Component Categorization — Components are automatically categorized based on their names and dependencies
  • Caching System — Local caching of component data to reduce GitHub API calls and work offline
  • Multiple Transport Options — Support for both stdio and HTTP transport methods
  • Fallback Mechanism — Mock data is provided when GitHub API is unavailable

The tools it exposes

The server publishes 2 tools. What each one is for:

  • get_all_components — Get a list of all available Magic UI components with their metadata
  • get_component_by_path — Get the source code of a specific component by its file path

Getting it running

Installation goes through your MCP client rather than a global install: point it at @modelcontextprotocol/inspector 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.

What it needs from you

Configuration is passed through the environment: GITHUB_TOKEN. Treat anything key-shaped as a real credential — scope it to the minimum the server needs, and rotate it if it ever lands in a shared config.

How it compares

Plenty of developer tooling servers cover similar ground. The differences that matter in practice are scope of access and how much setup stands between you and a working tool call. MCP Magic UI's toolset — get_all_components, get_component_by_path — is a fair guide to whether it matches your workflow. It is maintained by idcdev; worth a glance at recent repository activity before you build anything load-bearing on it.

SyncDev reviews every entry in this directory against the project's own documentation before publishing, and revisits them as servers change.

Things to watch

  • It runs with your machine's permissions. That is convenient and also the reason to think about what you point it at before you approve a tool call.
  • Missing credentials fail quietly in some clients — if no tools show up, check the environment block first.
  • Keep per-call confirmation enabled while you learn its behaviour; it is the cheapest safeguard you have.

Available tools

ToolWhat it does
get_all_componentsGet a list of all available Magic UI components with their metadata
get_component_by_pathGet the source code of a specific component by its file path

How to install the MCP Magic UI MCP server

{
  "mcpServers": {
    "magic-ui": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/inspector"],
      "env": {
        "GITHUB_TOKEN": "your-value"
      }
    }
  }
}

Add to claude_desktop_config.json, then restart Claude Desktop.

Configuration

VariableDescriptionRequired
GITHUB_TOKENCredential the server authenticates with.Yes

Example prompts to try

  • Use MCP Magic UI to get all components.
  • Use MCP Magic UI to get component by path.

Frequently asked questions

It allows AI assistants and other MCP clients to easily discover and use Magic UI components by exposing them through MCP tools.