Install, app by app

Every app needs the same thing: the address https://designers.allthepossibles.com/mcp. Menu names change as apps update. If you cannot find an item, search that app's help for "custom connector" or "MCP server".

You are on the Free tier with no key. To use Pro, add your key where each section shows. Run whoami afterwards to check.

Claude Desktop and claude.ai (no terminal)

1. Open Settings, then Connectors.
2. Choose Add custom connector.
3. Name: Designers. URL: https://designers.allthepossibles.com/mcp. Save.
4. Start a new chat, click the tools or plus menu, and make sure Designers is switched on.
5. Say: Call the getting_started tool.

Custom connectors need a paid Claude plan; if you do not see Add custom connector, your plan or workspace may not allow it. To use a Pro key, add it to the end of the URL as https://designers.allthepossibles.com/mcp?key=dz_... because these apps cannot send custom headers. Prompts appear from the plus menu as "Add from Designers".

Claude Code

claude mcp add --transport http designers https://designers.allthepossibles.com/mcp

With a Pro key:

claude mcp add --transport http designers https://designers.allthepossibles.com/mcp --header "Authorization: Bearer dz_YOUR_KEY"

Check it with /mcp inside Claude Code; it lists the server and its tools. Prompts run as slash commands such as /mcp__designers__critique. For skills:

/plugin marketplace add johnhowrey/atp-plugins
/plugin install atp-designers@atp-plugins

Cursor

1. Open Settings, then Tools and MCP (or MCP), then Add new MCP server. This opens mcp.json.
2. Add the server and save:

{
  "mcpServers": {
    "designers": {
      "url": "https://designers.allthepossibles.com/mcp",
      "headers": {
        "Authorization": "Bearer dz_YOUR_KEY (delete this line on the Free tier)"
      }
    }
  }
}

Restart Cursor fully. In a chat, tools show under the server name.

VS Code

1. Open the Command Palette and run MCP: Add Server, choose HTTP, paste the URL, name it designers. Or create .vscode/mcp.json:

{
  "servers": {
    "designers": {
      "type": "http",
      "url": "https://designers.allthepossibles.com/mcp"
    }
  }
}

Use Agent mode in Copilot Chat; start the server from the inline Start link above the entry if it is stopped.

Codex

Add this to ~/.codex/config.toml, then restart Codex:

[mcp_servers.designers]
url = "https://designers.allthepossibles.com/mcp"
# Pro: bearer_token_env_var = "DESIGNERS_KEY"   (set DESIGNERS_KEY in your shell)

ChatGPT

Settings, Connectors, Advanced, turn on Developer mode, then Create a connector, name it Designers and paste the URL. Developer mode and remote connectors are available on some paid plans only; if the option is missing, your plan or workspace does not have it. Use ?key= on the URL for Pro.

Pair it with Figma (optional)

Designers works on a live URL, pasted copy and screenshots with no Figma at all. To let your assistant read Figma files, add Figma's own MCP server as well. Follow Figma's current guide for your app; for Claude Code it is:

claude mcp add --transport http figma https://mcp.figma.com/mcp

then run /mcp in Claude Code, pick figma and sign in. In Figma, select a frame, right click, Copy/Paste as, Copy link to selection, and paste that link into your message. The link must contain ?node-id=. Figma's server has its own plan, seat and rate limits; doctor checks that your link is the right shape.

Not working? Troubleshooting.