Connect coding agents (MCP)

You can connect Claude Code, Cursor or any app that supports MCP (Model Context Protocol, a standard way for AI agents to use other tools) to Phluffle. Your agent can then read your prototypes, including screens, design tokens, data and open comments, and save its work back as new versions your team sees in Phluffle.

Pro Connecting coding agents is part of Pro. See Plans and credits.

#What it costs

Your agent runs on your own AI account, such as your Claude Code or Cursor subscription. So reading prototypes and saving versions use no Phluffle credits.

The one exception is when your agent asks Phluffle's own AI to build something (build_with_phluffle). That uses your Phluffle credits like any prompt.

#Create a token

A token is a private key that lets one app act as you.

1. Open Settings → Connections and find Coding agents.
2. Under New token name, give it a name you'll recognise, like "Claude Code on my MacBook".
3. Click Create token.
4. Copy the token. It's shown once: "Copy it now: it won't be shown again."

Heads up Treat tokens like passwords. Anyone with one can read and change your prototypes. Phluffle only stores a scrambled (hashed) copy, so it can't show it to you again.

You can have up to 10 tokens, for example one per computer or app. The list shows when each was last used and by which app ("Last used … by Cursor"). Click Revoke to turn one off; agents using it stop working right away.

#Connect your agent

After you create a token, the setup commands under Connect your agent already include it. Pick your app's tab and click Copy.

#Claude Code

Run this in your terminal:

claude mcp add --transport http phluffle --scope user https://phluffle.com/mcp \
  --header "Authorization: Bearer phl_YOUR_TOKEN"

#Cursor

Add this to ~/.cursor/mcp.json (or your project's .cursor/mcp.json):

{
    "mcpServers": {
        "phluffle": {
            "url": "https://phluffle.com/mcp",
            "headers": {
                "Authorization": "Bearer phl_YOUR_TOKEN"
            }
        }
    }
}

#Other apps

Any app that supports remote MCP servers can connect with:

• URL: https://phluffle.com/mcp
• Header: Authorization: Bearer phl_YOUR_TOKEN
• Transport: Streamable HTTP

#Ask your agent to work on a prototype

Then just ask, in plain words. For example:

List my Phluffle prototypes, then make the Pawsome pricing page show yearly prices.

Your agent can use these tools:

#See agent changes in Phluffle

Every save makes a new version, like any other change. See Versions, restore and retry.

• Versions your agent saved show Edited by Claude Code (or Cursor, or whichever app).
• Builds your agent asked Phluffle for show Requested by Claude Code.
• People who have the prototype open in the editor see new versions arrive live.

If your agent resolves a comment, its reply appears in the thread.

#Safety built in

• No overwriting. Each save must name the version it's based on. If someone saved a newer version since, the save is refused and your agent is told to re-read the prototype and reapply its change.
• Your access applies. If you can only view a prototype, your agent can read it but not save.
• One build at a time. Agents can't save while Phluffle is building a version of that prototype.
• Limits. 60 requests a minute per token, up to 50 agent saves per person in 24 hours, and HTML up to 2 MB per save.

#If something goes wrong

• "Missing or invalid Phluffle token": the token was revoked or mistyped. Create a new one and update your agent's setup.
• "The prototype is on vN now": someone saved a newer version. Ask your agent to read it again and reapply its change.
• "Connecting coding agents is part of Phluffle Pro": only listing prototypes works without Pro. Go Pro in Settings → Plan & credits.
• "Out of Phluffle credits": only build_with_phluffle needs credits. Your agent can still make the change itself and save it.

#Related

• Download the project (take it to code)
• Push to GitHub
• Comments and Fix with AI