It's like v0, but in your Cursor / Claude Code / Windsurf: search 10,000+ React/Tailwind components, generate new UI with AI, and publish your own - right from your editor. Magic MCP is now the 21st MCP; this package keeps old configs working. Setup: 21st.dev/mcp
What it is, and how people use it
It's like v0, but in your Cursor / Claude Code / Windsurf: search 10,000+ React/Tailwind components, generate new UI with AI, and publish your own - right from your editor. Magic MCP is now the 21st MCP; this package keeps old configs working. Setup: 21st.dev/mcp It sits on the MCP Servers shelf of the catalog, maintained by @21st-dev.
Why builders keep it installedMCP Servers benefits
An MCP server gives your agent typed access to a browser, database, chart engine or cloud account. It acts through the server instead of hallucinating what the API would have returned.
Servers run on your machine or your cloud. Access is scoped per tool and can be cut mid-session, so credentials never live inside the model.
Cursor, Claude Desktop, Codex CLI and Windsurf all speak MCP. The config you write today keeps working when you switch editor or model.
Tool calls pass through the server, so you get a log of exactly what the agent read, wrote or clicked - the difference between a demo and something you'd run at work.
Contributorsloading from GitHub…
Languagesestimated from snapshot
- TypeScript 85.2%
- Shell 11.1%
- JavaScript 3.7%