figma-use vs 21st.dev Magic MCP

A side-by-side comparison of two Design & Media servers — tools, transport, auth, maintenance, and copy-paste config for each.

	figma-use Control Figma from the terminal or as an MCP server — full read/write: create shapes, text, components, render JSX, export images. Unverified HTTP (remote) No auth TypeScript	21st.dev Magic MCP Generate beautiful, modern UI components from natural-language descriptions inside your IDE. Unverified stdio (local) API key TypeScript
Category	Design & Media	Design & Media
Language	TypeScript	TypeScript
Transport	HTTP (remote)	stdio (local)
Auth	None	API key
GitHub stars	571	5.2k
Last commit	2 months ago	4 months ago
Verified
Actively maintained
Install	`npm install -g figma-use`	`npx @21st-dev/cli@latest install <client> --api-key <key>`
Repo	Open	Open

Verdict

Pick figma-use if you want a hosted/remote server with nothing to install, and you want zero-setup with no API key.

Pick 21st.dev Magic MCP if you want the official, vendor-maintained server, and you prefer the more popular, battle-tested option.

Add figma-use

Install / run

npm install -g figma-use

Paste into ~/Library/Application Support/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "figma-use": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-remote",
        "http://localhost:38451/mcp"
      ]
    }
  }
}

Claude Desktop connects to remote servers through the `mcp-remote` proxy (installed on first run via npx). Restart Claude Desktop after saving.

Add 21st.dev Magic MCP

Install / run

npx @21st-dev/cli@latest install <client> --api-key <key>

Paste into ~/Library/Application Support/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "21st-dev-magic-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "@21st-dev/magic@latest",
        "API_KEY=\"your-api-key\""
      ]
    }
  }
}

FAQ

figma-use or 21st.dev Magic MCP — which is better?

Pick figma-use if you want a hosted/remote server with nothing to install, and you want zero-setup with no API key. Pick 21st.dev Magic MCP if you want the official, vendor-maintained server, and you prefer the more popular, battle-tested option.

Can I use both figma-use and 21st.dev Magic MCP?

Yes — MCP clients let you enable multiple servers at once. Add both configs to your client's mcpServers and use whichever tool fits the task.

Do figma-use and 21st.dev Magic MCP work with Claude, Cursor and Windsurf?

Both do. Copy the per-client config below into Claude Desktop, Cursor, or Windsurf.

View figma-use →View 21st.dev Magic MCP →More comparisons →