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, or Codex? 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

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.

  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.

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.”