Skip to main content
Glama
cbuntingde

Magic MCP Local

by cbuntingde
OverviewSchemaSourceRelated ServersDiscussionsAdmin
TypeScript

Magic MCP Local

A local-first MCP server for UI component generation. No API key required.

Features

  • 30+ Pre-built Components - Production-ready React components with TypeScript

  • Local-First - Works entirely offline, no external API calls

  • Zero Configuration - No API keys, no authentication

  • MCP Compatible - Works with Cursor, Windsurf, Cline, and other MCP clients

Installation

From npm (recommended)

npm install -g magic-mcp-local

Or use directly with npx

npx -y magic-mcp-local

Configuration

Cursor

Add to ~/.cursor/mcp.json:

{
  "mcpServers": {
    "magic-mcp-local": {
      "command": "npx",
      "args": ["-y", "magic-mcp-local"]
    }
  }
}

Windsurf

Add to ~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "magic-mcp-local": {
      "command": "npx",
      "args": ["-y", "magic-mcp-local"]
    }
  }
}

Cline

Add to ~/.cline/mcp_config.json:

{
  "mcpServers": {
    "magic-mcp-local": {
      "command": "npx",
      "args": ["-y", "magic-mcp-local"]
    }
  }
}

Claude Desktop

Add to ~/.claude/mcp_config.json:

{
  "mcpServers": {
    "magic-mcp-local": {
      "command": "npx",
      "args": ["-y", "magic-mcp-local"]
    }
  }
}

Available Tools

Tool

Description

create_ui_component

Create a UI component by describing what you need

search_components

Search components by keyword or category

get_component

Get a specific component by ID

list_categories

List all component categories

list_components

List all available components

Usage Examples

Create a Button

create_ui_component with description "primary action button with hover effects"

Search for Form Components

search_components with query "input field"

List Navigation Components

list_components with category "navigation"

Component Categories

  • buttons - Button variants (primary, icon, etc.)

  • forms - Input, textarea, select, checkbox, radio, switch

  • layout - Card, navbar, hero, footer, sidebar

  • navigation - Tabs, accordion, breadcrumb, pagination

  • data-display - Badge, avatar, table, stat cards

  • feedback - Alert, modal, progress, spinner, skeleton, tooltip

  • overlays - Modal, dropdown, tooltip

Development

# Install dependencies
npm install

# Build
npm run build

# Run in development mode
npm run dev

License

MIT

This server cannot be deployed

One endpoint for every MCP toolRayrun runs every MCP server behind one URL and holds the credentials. Each call is decided per client, tool, and argument, then recorded.ray.runAd

Resources

Related MCP Connectors

  • ClawLinkOAuth
    dev.claw-link

    MCP server connecting AI agents to 100+ apps (Gmail, Slack, Notion, GitHub) via one-click OAuth.

    App AutomationWorkplace & Productivity
    24
  • Remote MCPA
    com.remote-mcp.mcp

    The Remote MCP server acts as a standardized bridge between LLM applications (like Claude, ChatGPT, and Cursor) and external services, enabling AI agents to access external tools and resources. Its primary capability is providing a centralized search tool to discover other MCP servers and their respective tools. Unlike local implementations, it runs remotely with OAuth authentication and permission controls for security.

    Developer ToolsSearchAgent Orchestration
    13
  • Beamline UIOAuth
    io.beamline

    Beamline UI installs React UI code into your own repository: 200+ components and 50+ complete screens by Danylo Pravda. Editable source lands in src/ui/beamline; compiled archives live in your app's .beamline/packages/. Commit those files with your app. Nothing at runtime calls Beamline servers. The hosted MCP server is an optional discovery and installation tool for your coding agent; the shadcn CLI installs the same parts. Nine looks, dark and light. The Complete System is $49 launch price, plus VAT or sales tax where it applies: one payment for one person's Beamline account, MCP, library, installs and updates, with lifetime updates for as long as we publish the purchased system. Teammates, contractors and clients may use, edit, build and ship the installed code as part of that app. They need their own licence for Beamline access or to take its parts into other apps. The free sample remains MIT, including commercial use. https://beamline.io

    Developer Tools
    1
  • ПромтЛаб — библиотека AI-промптов
    ru.promtlabs

    Self-hosted AI prompt library: prompts, collections, tags, teams, chains. 29 MCP tools for agents.

    AI & Machine LearningKnowledge & MemoryDeveloper Tools
    2