MCPs

Model Context Protocol - Tools you can equip your AI with for specialized capabilities

What are MCPs?

MCPs (Model Context Protocol) are tools you can equip your AI with. Instead of manually providing information to your AI, MCPs give your AI direct access to specialized services and capabilities.

How MCPs Transform Your Workflow:

Without MCP: Go to 21st Dev → Find component → Copy info → Pass to AI

With MCP: "Use 21st Dev MCP to make me a..."

How MCPs Work

MCPs connect your AI directly to services, eliminating manual steps. Here are some real-world examples:

Base MCP Example

Building onchain apps with Onchain Kit

Traditional way: Install packages → Create components → Make API calls → Provide documentation for each step

With Base MCP: "Use Base MCP to..."

21st Dev MCP Example

Getting UI components directly

Traditional way: Browse 21st Dev → Find component → Copy prompt → Paste to AI

With 21st Dev MCP: "Use 21st Dev MCP to make me a..."

Amazing MCP Use Cases

Popular MCPs to Get Started

MCP Directories

Using MCPs with AI

Once you have MCPs installed, use these prompts to leverage their capabilities:

🚀 Base Development

"Use Base MCP to create an onchain transaction component for my Next.js app"

🎨 UI Components

"Use 21st Dev MCP to make me a animated pricing card with hover effects"

🔍 Research & Search

"Use Exa MCP to research the latest trends in AI development on GitHub"

🎵 Creative Projects

"Use Music MCP to compose a background track for my web app"

📊 Data & Analytics

"Use Analytics MCP to create charts showing user engagement metrics"

Learn to Build MCPs

Want to create custom tools for your AI? You can build your own MCPs to extend AI capabilities for your specific needs.

Learn to Build MCPs

Step-by-step guide to creating your own MCP

Follow this comprehensive guide to understand MCP architecture and build custom tools for your specific use cases.