Open Source · MIT License

mcpdrop

The fastest way to add an MCP-powered AI copilot to any web app.

Usage
<!-- 1. Start the bridge -->
<!-- 2. Drop this in your app -->
<script src="@mcp-drop/core"></script>

<mcp-drop
  mcp-servers='[{"name":"bridge",
    "url":"http://localhost:3333"}]'
  persist-key
></mcp-drop>
Chat UI
Tool Use
MCP Servers
API Key Mgmt
Web Component
Zero Dependencies

👉 Start the bridge: npx @mcp-drop/bridge then connect below

Use Case 01

In-app AI Copilot

Add Claude directly inside your SaaS product and keep users inside your app while they work.

Use Case 02

Connect Any Tool

Filesystem, databases, APIs, design tools, or internal systems. If it has an MCP server, it plugs in.

Use Case 03

Ship in Minutes

One script tag. No backend. No lock-in. Drop the component into your app and start wiring tools.

Before you start

Set up the two pieces you need locally before testing the demo.

Node.js 18+

Required to run @mcp-drop/bridge locally.