#37 · Primary category: AI Design & Prototyping
magic-mcp
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
Project last updated:07/31/26
GitHub Stars
5.8K
Forks
439
Contributors
7
License
Other
Why we included this project
Frontend developers who work inside Cursor, Claude Code, or Windsurf can browse a searchable catalog of more than 10,000 ready-made React and Tailwind components and have an agent generate new UI on demand, all without leaving the editor. The MCP server gives the assistant tools for finding inspiration, generating components from a prompt, refining existing markup, and publishing or retrieving components. What this specific package adds is a compatibility layer: it forwards requests from older Magic MCP configurations to the newer 21st MCP service, so teams already wired to the legacy tool names keep working while they migrate. If your agent workflows were built around the old Magic calls, they still map cleanly to the current generate and search functions. It is a practical way to keep a large, curated component library reachable directly through your coding agent instead of managing hand-maintained snippets.
Articles for this project
No articles for this project yet.
To suggest a topic or contribute an article, contact us.
Related projects in this category
open-design
Open-source Claude Design alternative: local-first desktop app turning coding agents into a design engine for prototypes, landing pages, dashboards, slides, images, and video, with file exports (HTML, PDF, PPTX, MP4).
impeccable
The design language that makes your AI harness better at design.
gradio
Build and share delightful machine learning apps, all in Python. 🌟 Star to support our work!
tldraw
Build infinite canvas apps in React with the tldraw SDK. World's best, top-most agent recommended #1 five star SDK.
next-ai-draw-io
A next.js web application that integrates AI capabilities with draw.io diagrams. This app allows you to create, modify, and enhance diagrams through natural language commands and AI-assisted visualization.