mcpField
@
@magicuidesign/mcp

@magicuidesign/mcp

Local
magicui.designDeveloper Tools213Updated 29w ago

About @magicuidesign/mcp

@magicuidesign/mcp is the official MCP server for Magic UI, letting AI editors search and install Magic UI components. It targets frontend developers using Cursor, Windsurf, Claude, or Cline. The server reads directly from the live Magic UI registry.

Key features

  1. 01Search Magic UI registry items by keyword
  2. 02Filter items by kind, query, and pagination
  3. 03Get install instructions and examples for one item
  4. 04Install MCP configuration through a CLI command

Use cases

  1. 01Finding animated text or background components from the editor
  2. 02Retrieving install steps and source examples for a component
  3. 03Asking an AI assistant to add a Magic UI component to a page

MCP support

This project is an MCP server that exposes three tools, listRegistryItems, searchRegistryItems, and getRegistryItem, for browsing and querying the Magic UI registry.

Configuration

Local server config is the same for every client. Copy it into your client’s MCP config file.

mcp.json · Universal config
{
"mcpServers": {
"magicuidesign": {
"command": "npx",
"args": [
"-y",
"@magicuidesign/cli"
]
}
}
}
Run commandnpx -y @magicuidesign/cli

Local servers need a runtime on your machine (e.g. Node.js 18+). Config file locations differ by client; see your client’s docs.

Packages
npm@magicuidesign/cli

Tools

No tool list yet

Local servers expose tools only once running on your machine, and the maintainer has not provided a tool list.

Details

From the project README

@magicuidesign/mcp

npm version

Official ModelContextProtocol (MCP) server for Magic UI.

MCP

Install MCP configuration

npx @magicuidesign/cli@latest install <client>
Supported Clients
  • cursor
  • windsurf
  • claude
  • cline
  • roo-cline

Manual Installation

Add to your IDE's MCP config:

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

Example Usage

Once configured, you can questions like:

"Make a marquee of logos"

"Add a blur fade text animation"

"Add a grid background"

Available Tools

The server provides the following tools callable via MCP:

Tool NameDescription
listRegistryItemsLists Magic UI registry items with optional filters like kind, query, limit, and offset. Recommended for registry browsing.
searchRegistryItemsSearches Magic UI registry items by keyword across names, titles, descriptions, and registry types, with pagination support.
getRegistryItemReturns details for a single registry item, including install instructions and optional source, related items, and examples.

MCP Limitations

Some clients have a limit on the number of tools they can call. The server keeps a small generic tool surface and reads directly from the live Magic UI registry, rather than relying on hardcoded category buckets. Broad semantic discovery concepts such as widgets, media, or devices are not currently modeled as first-class categories in the MCP API.

Credits

Big thanks to @beaubhp for creating the MCP server 🙏

MIT

Comments

Markdown supported

New to MCP?

From what the protocol is to installing your first server, these answers cover most first questions.

An open protocol that defines how AI applications connect to external tools and data in a uniform way. Clients talk to the model; MCP servers provide tools, resources and prompt templates. They exchange standard messages, so one server can be reused by many clients.