Skip to content

Connect an AI Assistant

Connect your AI assistant to Tailwind’s remote MCP server. OAuth is the recommended setup wherever the client supports it: your client opens Tailwind in a browser, you sign in and approve access, and no API key needs to be copied.

https://mcp.tailwind.ai

Choose your client below. If you are building a server-side integration rather than connecting an assistant, use the REST API documentation.

Using Claude Code, Cursor, Codex, or OpenCode? One command sets up the connection and installs a usage playbook that teaches the agent how Tailwind’s Pins, Boards, and drafts fit together:

Terminal window
npx @tailwind-app/skills

The installer detects which of those tools you have, asks before writing anything, and prints every file it touches. Pass --dry-run to see the plan without changing a file, or --harness cursor to target one tool. Restart your agent afterwards — MCP configuration is read at startup.

It needs Node 20 or later and has no runtime dependencies. Aside from npx downloading the package from npm the first time — as it would for any package — the installer makes no outbound requests of its own: the playbook ships inside the published package, so nothing is fetched from Tailwind’s servers and a pinned version cannot change underneath you. The source is at github.com/tailwind/skills, and every release is published from that repository’s own CI with npm provenance.

Prefer to configure things yourself? The per-client instructions below do the same job by hand.

claude.ai uses a native remote connector and OAuth. Custom remote connectors are currently in beta and available on Pro, Max, Team, and Enterprise plans.

  1. Open Connectors. In Claude, go to Settings > Connectors.
  2. Add a custom connector. Choose Add custom connector and enter https://mcp.tailwind.ai. On a Team or Enterprise plan, an org Owner must add the connector.
  3. Connect Tailwind. Follow the browser prompt to sign in to Tailwind and approve access.
  4. Enable the connector. Open Connectors from the + menu in a conversation and enable Tailwind.

Claude Desktop can use the same native remote connector and OAuth flow as claude.ai. This remote-connector feature is currently in beta.

  1. Open Connectors. In Claude Desktop, go to Settings > Connectors.
  2. Add a custom connector. Enter https://mcp.tailwind.ai as the remote MCP server URL.
  3. Connect Tailwind. Follow the browser prompt to sign in to Tailwind and approve access.

Use this only if the native remote connector is unavailable in your Claude Desktop installation. It runs mcp-remote through Node.js and stores a Tailwind API key in your local Claude configuration.

  1. Create a Tailwind API key.
  2. Open the Claude Desktop configuration file:
    • macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
    • Windows: %APPDATA%\Claude\claude_desktop_config.json
  3. Add the configuration below and replace your_api_key_here with your key.
  4. Quit and reopen Claude Desktop.
{
"mcpServers": {
"tailwind": {
"command": "npx",
"args": [
"-y",
"mcp-remote",
"https://mcp.tailwind.ai",
"--header",
"Authorization: Bearer your_api_key_here"
]
}
}
}

ChatGPT connects to Tailwind with OAuth. It cannot use the API-key fallback. Custom MCP apps and write actions are currently in beta on ChatGPT web for Business, Enterprise, and Edu workspaces. A workspace admin or owner must enable developer mode and approve the app before members can use it. Consumer Free, Plus, and Pro accounts cannot add this custom app.

  1. Enable developer mode. In ChatGPT Settings > Apps > Advanced settings, turn on developer mode. A Business, Enterprise, or Edu workspace admin must enable access for your role first.
  2. Create the Tailwind app. Choose Create app, enter https://mcp.tailwind.ai, and select OAuth authentication.
  3. Scan and authorize. Scan the available tools, then sign in to Tailwind and approve access when prompted.
  4. Use Tailwind in a chat. Start a new chat and select the Tailwind app from the tools menu.

If Create app or developer mode is unavailable in a supported workspace, ask your ChatGPT workspace admin to confirm that custom MCP apps are enabled for your role.

Claude Code supports remote HTTP servers and OAuth natively.

One command does all of this for you, including the usage playbook.

  1. Add the server. Run the command below. Add --scope user before tailwind to make it available across projects.
  2. Authenticate. In Claude Code, run /mcp, select Tailwind, and follow the browser sign-in flow.
  3. Verify the connection. Ask Claude to list your Tailwind Pinterest accounts.
Terminal window
claude mcp add --transport http tailwind https://mcp.tailwind.ai

If OAuth is unavailable, create an API key and add Tailwind again with an authorization header:

Terminal window
claude mcp add --transport http --header 'Authorization: Bearer your_api_key_here' tailwind https://mcp.tailwind.ai

Cursor supports Streamable HTTP servers and OAuth. The install link contains only Tailwind’s public server URL; Cursor shows the configuration for review before saving it.

One command does all of this for you, including the usage playbook.

  1. Install the server. Use the Add to Cursor link below and review the remote server configuration before installing.
  2. Authenticate. When Cursor prompts you, sign in to Tailwind and approve access.
  3. Verify the connection. Open Cursor's MCP settings and confirm that Tailwind is enabled, then ask about your Tailwind accounts in chat.
Add to Cursor

To configure Cursor manually, save this in ~/.cursor/mcp.json or your project’s .cursor/mcp.json. Cursor starts the OAuth flow when it connects.

{
"mcpServers": {
"tailwind": {
"url": "https://mcp.tailwind.ai"
}
}
}

If OAuth is unavailable, create an API key, use this configuration, and replace your_api_key_here with your key:

{
"mcpServers": {
"tailwind": {
"url": "https://mcp.tailwind.ai",
"headers": {
"Authorization": "Bearer your_api_key_here"
}
}
}
}

Codex supports remote Streamable HTTP MCP servers natively with OAuth. This requires Codex CLI 0.77.0 or later; earlier versions needed an experimental flag that no longer exists.

One command does all of this for you, including the usage playbook.

  1. Add the server. Run the command below. Remote MCP servers need Codex CLI 0.77.0 or later; check yours with codex --version.
  2. Authenticate. Run codex mcp login tailwind, then sign in to Tailwind and approve access in the browser.
  3. Verify the connection. Start a new Codex session and ask it to list your Tailwind Pinterest accounts.
Terminal window
codex mcp add tailwind --url https://mcp.tailwind.ai

If OAuth is unavailable, create an API key and export it as TAILWIND_API_KEY in the environment where codex runs, then add Tailwind again pointing at that variable. Codex rejects a literal bearer token in its config file, so the key must come from the environment rather than being inlined. Create a Tailwind API key.

Terminal window
codex mcp add tailwind --url https://mcp.tailwind.ai --bearer-token-env-var TAILWIND_API_KEY

OpenCode supports remote MCP servers natively and handles OAuth on its own: the first time a tool needs Tailwind it registers a client dynamically and opens the browser for you.

One command does all of this for you, including the usage playbook.

  1. Add the server. Run the command below. It writes the entry to your global OpenCode config, leaving any comments and other servers in place.
  2. Authenticate. Run opencode mcp auth tailwind, then sign in to Tailwind and approve access in the browser.
  3. Verify the connection. Start a new OpenCode session and ask it to list your Tailwind Pinterest accounts.
Terminal window
opencode mcp add tailwind --url https://mcp.tailwind.ai

This edits your global OpenCode config (~/.config/opencode/opencode.json, or under $XDG_CONFIG_HOME/$OPENCODE_CONFIG_DIR if either is set), adding only the tailwind entry under mcp and preserving any comments already in the file. A project’s own opencode.json overrides the global one, so if a project already defines mcp.tailwind, that entry wins there regardless of what this command writes globally.

If OAuth is unavailable, create a Tailwind API key and pass it as a header instead. OpenCode reads headers as KEY=VALUE pairs, so the whole Bearer value is one argument.

Terminal window
opencode mcp add tailwind --url https://mcp.tailwind.ai --header 'Authorization=Bearer your_api_key_here'

For a client without a Tailwind-specific guide, configure a remote Streamable HTTP server with a bearer token.

Tailwind OAuth requires support for OAuth Protected Resource Metadata (RFC 9728), including following the advertised authorization server to a different host. Older clients may not support this discovery flow, so the compatibility setup below uses an API key.

  1. Create an API key. Create a key from Settings > Integrations in Tailwind.
  2. Add the remote server. Configure https://mcp.tailwind.ai as a Streamable HTTP server.
  3. Add authorization. Send the API key as an Authorization: Bearer header.

Replace your_api_key_here with your Tailwind API key. Your client’s outer configuration shape may differ.

{
"mcpServers": {
"tailwind": {
"type": "http",
"url": "https://mcp.tailwind.ai",
"headers": {
"Authorization": "Bearer your_api_key_here"
}
}
}
}

Clients that support only local stdio servers may use mcp-remote as a compatibility bridge, but prefer a native remote HTTP connection when one is available.

API keys are for clients that cannot complete Tailwind’s OAuth flow.

  1. Sign in to Tailwind.
  2. Open Settings > Integrations.
  3. Create an API key and copy it immediately.
  4. Replace your_api_key_here in your client’s fallback configuration.

Keep the key private. Do not paste it into a chat, commit it to version control, or share it with another person. Revoke unused or exposed keys from Settings > Integrations.

There is nothing to configure here — this section is for when a client asks, or when you are debugging a connection.

Tailwind’s server speaks both eras of the Model Context Protocol on the same URL:

  • 2026-07-28, the current revision. Each request carries its own protocol version, so there is no connection handshake and no session to expire.
  • 2025-06-18 and 2025-03-26, the older revisions that open with an initialize handshake.

Your client picks the newest revision both sides support, on its own. Older clients keep working exactly as before, and a client that upgrades needs no change on your side.

The client reports an unsupported protocol version

Section titled “The client reports an unsupported protocol version”

This means the client asked for a revision Tailwind does not serve — usually a pre-release or draft version, not an older one.

  1. Update the client, or switch it off any experimental or draft protocol setting.
  2. The error names the revisions Tailwind supports; pick one of those if the client lets you choose.
  3. If the client sends a version Tailwind should support, contact support with the version string and the client name.

The connection fails immediately with a 400 error

Section titled “The connection fails immediately with a 400 error”

A 400 is a malformed request rather than a permissions problem, so re-authenticating will not clear it. It usually means the client sent an inconsistent request — most often a proxy or gateway in front of the client rewrote part of it.

  1. Retry without any corporate proxy, VPN, or request-rewriting extension in the path.
  2. Confirm that the server URL is exactly https://mcp.tailwind.ai, with no trailing path.
  3. Update the client — older pre-release builds of the 2026-07-28 revision sent incomplete requests.
  1. Confirm that the server URL is exactly https://mcp.tailwind.ai.
  2. Open the client’s MCP or connector settings and retry authentication.
  3. Confirm that pop-ups and redirects are allowed for the client.
  4. For Claude Code, run /mcp, select Tailwind, and choose the authentication option.
  • On Claude Team or Enterprise, an organization Owner must add the custom connector before members can connect.
  • On ChatGPT Business, Enterprise, or Edu, an admin or owner must enable developer mode and approve the custom app for the workspace.
  1. Confirm that the key starts with tw_pk_ and has not been revoked.
  2. Remove any extra spaces or quotation marks from the key value.
  3. Confirm that the header is Authorization: Bearer your_api_key_here.
  4. Create a replacement key from Settings > Integrations if needed.
  1. Wait a few seconds for the server to initialize.
  2. Start a new conversation and make sure Tailwind is enabled for it.
  3. Ask the assistant to list your Tailwind Pinterest accounts.
  4. Check the client’s MCP logs or connection details for an error.
If Claude says it has no Tailwind tools even though the connector shows as connected, the tools are connected but not loaded into the conversation. Work through these in order.
  1. Ask for Tailwind by name. Write "use the Tailwind connector to create a Pin from this URL" instead of "create a Pin from this URL". Naming the connector makes Claude look its tools up on the spot — if that works, the connection is fine and only the loading setting below needs changing.
  2. Load the tools upfront. In a conversation, open the + menu, choose Connectors, then Tool access, and select Tools already loaded. The default, Load tools when needed, holds a connector's tools back until Claude searches for them.
  3. Check each tool's own toggle. In Claude, open Settings > Connectors > Tailwind. Every tool has its own switch, and with all of them off Claude sees nothing to call.
  4. Try Claude Desktop or Claude Code. Both connect to the same server URL and load Tailwind's tools without this setting. Custom connectors on claude.ai are still in beta.

Once connected, try:

  1. Check accounts: “List my Pinterest accounts.”
  2. View boards: “What boards do I have on my business account?”
  3. Review posts: “Show me my queued Tailwind posts.”
  4. Create a test draft: “Create a draft pin from this image URL.”

If you have more than one Pinterest account

Section titled “If you have more than one Pinterest account”

Every tool that acts on Pinterest content — creating, scheduling, deleting, or listing Pins; browsing boards or timeslots; generating Pins from a URL — takes an explicit accountId, so the client picks the account before the request reaches Tailwind. When several accounts are connected and your prompt does not say which one you mean, the client chooses — and a client that guesses can schedule Pins to the wrong account.

Tailwind’s server instructions, tool descriptions, and list_accounts response all tell the client to ask you which account to use when the choice is ambiguous. That guidance is advisory: the protocol lets a client ignore it.

Name the account in the prompt whenever it matters:

  • “Schedule this Pin to my @mybrand account.”
  • “List the queued Pins on @myshop, not my personal account.”

If a client acted on the wrong account, ask it which accountId it used — the ID and username both appear in the list_accounts output.