home / mcp / material ui mcp server

Material UI MCP Server

Provides MCP access to Material UI component documentation for AI assistants and developer workflows.

Installation

Add the following to your MCP client configuration file.

Configuration

{
  "mcpServers": {
    "codedthemes-mui-mcp-codedthemes": {
      "url": "https://mui-mcp-cloudflare.jgentes.workers.dev/sse"
    }
  }
}

The Material UI MCP Server gives AI assistants quick, structured access to Material UI component documentation via MCP. It enables consistent usage, fast component discovery, and up-to-date guidance for building React apps with Material UI components.

How to use

You connect an MCP client to the Material UI MCP Server to query component data, documentation links, and setup guidance. Common tasks include listing all components, viewing detailed information for a specific component, searching by use case, and retrieving theming or setup instructions. Use the available tools to explore, learn, and implement Material UI features with confidence.

How to install

Prerequisites: ensure you have Node.js and npm installed on your system. You should also have a MCP client or integration ready to connect to an MCP server.

Option 1 Quick Start (no deployment needed) Connect to the public Material UI MCP server and start using it immediately.

claude mcp add mui npx mcp-remote https://mui-mcp-cloudflare.jgentes.workers.dev/sse

Option 2 Deploy Your Own (Cloudflare Workers) Deploy and run your own MCP server instance, then connect Claude Code to it.

1) Deploy to Cloudflare Workers (follow the deployment flow provided by your environment). After deployment, use the following MCP URL.

# Example connection after deployment
claude mcp add mui npx mcp-remote https://mui-mcp-cloudflare.<your-account>.workers.dev/sse

2) If you prefer to connect via configuration, add your MCP server to the client settings.

{
  "mcpServers": {
    "mui": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://mui-mcp-cloudflare.<your-account>.workers.dev/sse"
      ]
    }
  }
}

Additional notes

Option 3 Local Server Run locally with the development server. This lets you run an MCP instance on your machine for testing and development.

# Install dependencies
npm install

# Run locally on http://localhost:8787
npm run dev

Connect to your local instance in Claude Code.

claude mcp add mui npx mcp-remote http://localhost:8787/sse

Or use a manual config snippet.

{
  "mcpServers": {
    "mui": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "http://localhost:8787/sse"
      ]
    }
  }
}

Available tools

list_components

Browse all available Material UI components to understand what you can use in your projects.

get_component_info

Retrieve detailed information for a specific component, including imports and documentation links.

search_components

Find components by use case or category, such as forms, navigation, or data display.

get_customization_guide

Access Material UI theming and styling guidance for customization and consistency.

get_setup_guide

Obtain installation and setup instructions to integrate Material UI into your project.

get_mui_guide

Get a comprehensive guide to Material UI documentation and best practices.