Magic MCP Server
UI component generation and discovery integrated via 21st platform proxy services.
Data last scanned today · Reviewed today
Overview
Magic MCP acts as a compatibility proxy for the unified 21st MCP infrastructure, enabling AI agents to access component catalogs, themes, templates, and UI generation tools. It translates legacy tool names into the modern 21st toolset, ensuring existing configurations remain functional while providing access to the current 21st API. Users can authenticate via a new API key generated at 21st.dev to interface with the server. While the package remains available as a proxy, the maintainers recommend migrating to the 21st CLI for full, native support of the complete tool library, including advanced features like bookmarks and team library management.
Our verdict
With a security score of 45/100, this server is classified as high-risk. A significant concern is the absence of a detected open-source license, which creates ambiguity regarding the legal terms for implementation. Because it is a community-maintained proxy, potential users should proceed with caution and prefer the recommended 21st CLI migration path over this legacy wrapper.
- Retains support for legacy tool name invocations
- Zero direct dependencies minimize supply chain surface
- Includes active documentation and repository updates
- No license detected for usage rights
- Community-maintained rather than official vendor release
- Requires manual API key rotation due to legacy reset
Setup
{
"mcpServers": {
"magic-mcp": {
"args": [
"-y",
"@21st-dev/magic"
],
"command": "npx"
}
}
}Paste into ~/Library/Application Support/Claude/claude_desktop_config.json (macOS) or %APPDATA%\Claude\claude_desktop_config.json (Windows), then restart Claude Desktop. Some servers require API keys or tokens as environment variables — check the project's README and add an "env" object if needed.
- No read-only mode — running this grants full read/write access.
- No built-in authentication — anyone with access to this config can invoke every tool it exposes.
Tools
| Tool | Description | Risk |
|---|---|---|
| generate | Generates UI components. | medium |
| get_inspiration | Fetches component inspiration. | low |
| search_logo | Searches for logos. | low |
Compatibility
| Client | Local | Docker | Remote | Read-only |
|---|---|---|---|---|
| Claude Desktop | ||||
| Cursor | ||||
| VS Code | ||||
| Windsurf | ||||
| ChatGPT |
Frequently asked questions
›Can I continue using my existing @21st-dev/magic configuration?
Yes, this package acts as a compatibility proxy that forwards messages to the unified 21st MCP, allowing your existing configuration to remain functional.
›Why did my old API key stop working?
All API keys issued by the old Magic console were reset for security, and you must generate a new key at 21st.dev/mcp.
›How do I provide my API key to the legacy package?
The API key can be provided as a positional argument, via various flag formats like --API_KEY=..., or through the TWENTY_FIRST_API_KEY and API_KEY_21ST environment variables.
›Will my agents still understand the legacy tool names?
Yes, the 21st MCP automatically translates legacy Magic tool names like 21st_magic_component_builder to the new counterparts.
›How can I see all available tools in the new server?
You can connect to the server and call the tools/list command to view the complete catalog of tools, which includes functionality beyond the original four tools.
›What is the recommended installation method?
The recommended approach is to use the 21st CLI by running npx @21st-dev/cli@latest init, which sets up the server for clients like Cursor, Claude, or VS Code.
Badge
Maintain this server? Add the live badge to your README.