claude-handoff-mcp

claude-handoff-mcp

An MCP server that fetches and extracts Claude Design handoff bundles from URLs, enabling users to deploy design files directly into their projects with a single tool call.

Category
Visit Server

README

claude-handoff-mcp

The first open-source MCP server for Claude Design handoff bundles.

Paste a Claude Design handoff URL in Cursor, Claude Code, Cline, Windsurf — or any MCP-compatible client — and the bundle materializes in your project, ready to ship.

Paste handoff URL  →  MCP fetches, extracts, summarizes the README,
                      and deploys files into your repo. One tool call.

Why

Claude Design (Anthropic Labs, launched 2026-04-17) exports designs as handoff URLs served from api.anthropic.com/v1/design/h/<hash>. Today, consuming them means: download tar, extract, read README, figure out what to copy where. This MCP makes that one step in any agentic IDE.

  • Status: community project. Not affiliated with Anthropic.
  • Scope: wraps the publicly-served handoff bundle format. No scraping, no undocumented endpoints beyond the published handoff URL, no claude.ai session spoofing.

Tools exposed

Tool What it does
fetch_handoff(url) Download + extract the bundle to a temp dir. Detects HTML / PPTX / PDF.
inspect_bundle(extract_dir) Summarize: README, entry HTML, file counts, 60-line preview.
read_readme(extract_dir) Read the full handoff README (Claude Design always includes one).
deploy_bundle(extract_dir, target, dest_dir) Copy files into a project folder or emit a JSON manifest.

Install

npm install -g @kiwuuu/claude-handoff-mcp

Use in Claude Code

Add to your MCP config (~/.claude.json or wherever your client reads MCP servers):

{
  "mcpServers": {
    "claude-handoff": {
      "command": "npx",
      "args": ["-y", "@kiwuuu/claude-handoff-mcp"]
    }
  }
}

Then in chat:

Fetch https://api.anthropic.com/v1/design/h/abc123 and deploy it into ./public/

Use in Cursor / Cline / Windsurf

Same config shape — point at the npx entry. See each client's MCP docs for the exact file.

Use the CLI directly

npx claude-handoff one-shot https://api.anthropic.com/v1/design/h/abc123 ./my-app/public

Caveats

  • Handoff URLs expire. They have a TTL and may be single-use. The Share-menu export is the only way to get a fresh URL — there is no public listing endpoint. If fetch_handoff returns HTTP 404, the URL has aged out; re-export from claude.ai/design.
  • No API key used. This tool calls only the public handoff URL. It does not require ANTHROPIC_API_KEY.
  • Format stability. The bundle format is observed, not specified. If Anthropic changes it, this tool adapts or pauses.

Contributing

Issues + PRs welcome. The core fetch/extract/deploy logic is <400 LOC in src/core.ts — easy to read, easy to fork.

License

MIT. See LICENSE.

Recommended Servers

playwright-mcp

playwright-mcp

A Model Context Protocol server that enables LLMs to interact with web pages through structured accessibility snapshots without requiring vision models or screenshots.

Official
Featured
TypeScript
Magic Component Platform (MCP)

Magic Component Platform (MCP)

An AI-powered tool that generates modern UI components from natural language descriptions, integrating with popular IDEs to streamline UI development workflow.

Official
Featured
Local
TypeScript
Audiense Insights MCP Server

Audiense Insights MCP Server

Enables interaction with Audiense Insights accounts via the Model Context Protocol, facilitating the extraction and analysis of marketing insights and audience data including demographics, behavior, and influencer engagement.

Official
Featured
Local
TypeScript
VeyraX MCP

VeyraX MCP

Single MCP tool to connect all your favorite tools: Gmail, Calendar and 40 more.

Official
Featured
Local
graphlit-mcp-server

graphlit-mcp-server

The Model Context Protocol (MCP) Server enables integration between MCP clients and the Graphlit service. Ingest anything from Slack to Gmail to podcast feeds, in addition to web crawling, into a Graphlit project - and then retrieve relevant contents from the MCP client.

Official
Featured
TypeScript
Kagi MCP Server

Kagi MCP Server

An MCP server that integrates Kagi search capabilities with Claude AI, enabling Claude to perform real-time web searches when answering questions that require up-to-date information.

Official
Featured
Python
E2B

E2B

Using MCP to run code via e2b.

Official
Featured
Neon Database

Neon Database

MCP server for interacting with Neon Management API and databases

Official
Featured
Exa Search

Exa Search

A Model Context Protocol (MCP) server lets AI assistants like Claude use the Exa AI Search API for web searches. This setup allows AI models to get real-time web information in a safe and controlled way.

Official
Featured
Qdrant Server

Qdrant Server

This repository is an example of how to create a MCP server for Qdrant, a vector search engine.

Official
Featured