Magic MCP Server

About Magic

Magic empowers developers to create modern UI components instantly using natural language descriptions. Integrates with Cursor, Windsurf, and VSCode (Cline). Offers a customizable component library inspired by 21st.dev, real-time preview, and full TypeScript and SVGL support.

Tags

How to install Magic

Transport

Remote (Streamable HTTP), Local (stdio)

Hosted endpoint

https://21st.dev/api/mcp

Install or run

npx @21st-dev/cli@latest init --client cursor

Client configuration

{
  "mcpServers": {
    "magic-21st-dev": {
      "url": "https://21st.dev/api/mcp",
      "headers": {
        "x-api-key": "YOUR_21ST_API_KEY"
      }
    }
  }
}

Copied from the official README — verified October 4, 2026. Replace placeholder keys with your own credentials.

Client setup documented by the maintainer

“Not documented” means the README has no client-specific steps — most MCP clients can still run a local stdio server from the configuration above.

Related MCP servers in Design Tools