21st Magic MCP

21st Magic MCP 是 21st.dev 推出的 Model Context Protocol 服务器，将 v0 级别的 UI 生成能力直接嵌入你的 AI 编码编辑器。

核心功能

• 组件搜索：搜索10000+生产级React/Tailwind CSS组件，涵盖导航、表单、卡片、Dashboard等
• AI生成UI：根据自然语言描述即时生成精美UI组件，类似v0体验
• Logo搜索：内置品牌logo搜索工具，快速找到官方品牌logo
• 组件优化：AI可迭代优化已生成的组件样式和交互
• 组件发布：支持将自己的组件发布到21st.dev社区

适用场景

• 在Cursor中快速搭建着陆页、Dashboard、表单页面
• AI辅助生成响应式UI组件，无需手写CSS
• 快速找到现成组件复用，提升前端开发效率
• 设计系统快速原型验证

安装配置

npx @21st-dev/magic-mcp@latest

在 Cursor 或 Claude Desktop 中添加：

{
  "mcpServers": {
    "21st-dev": {
      "command": "npx",
      "args": ["-y", "@21st-dev/magic-mcp"],
      "env": { "TWENTY_FIRST_API_KEY": "your-api-key" }
    }
  }
}

免费使用基础功能，高级组件和生成额度需订阅21st.dev Pro。