How to connect Dribbble to Claude

Connect Claude Web, Desktop and Cowork to Dribbble MCP. Upload new shot from figma export, create project and add selected shots, and more using natural language, with authentication handled for you.

Dribbble logoDribbble
Oauth2

Dribbble is a design community and publishing platform for managing shots, projects, and attachments. Use it to showcase work, collect feedback, and organize creative designs.

12 Tools

Introduction

Claude is Anthropic's AI assistant, available on the web, in the desktop app, and on mobile. Cowork is its agent for knowledge work, and it runs on all of those surfaces too. Connected to your apps, Claude can work with your files and services to accomplish complex tasks on your behalf.

This guide walks you through the easiest and most secure way to connect your Dribbble account to Claude via Composio Connect, enabling it to upload new shot from Figma export, create project and add selected shots, list all your unpublished drafts and attachments, and more such actions on your behalf without compromising your account security.

Setup is the same on Claude Web, Desktop, and Cowork, and you only need to do it once. The connector is tied to your account, so it's available in all three.

Also integrate Dribbble with

Connecting Dribbble to Claude Web, Desktop, and Cowork

Two ways to add the Composio connector. Pick whichever you prefer.

1. Add with one click

Click the button. Claude opens with the Composio connector filled in. Click Add, then go to step 2.

Add to Claude

Add manually

In Claude Desktop, click Customize in the left sidebar, then select Connectors and click the + icon at the top.

Claude Desktop connectors screen with Add custom connector selected

Click Add custom connector and paste in the Composio MCP server URL:

bash
https://connect.composio.dev/mcp
Add custom connector dialog with Composio MCP server URL

2. Authorize in your browser

Click Connect. You'll be redirected to a browser window where you can authorize Composio to continue.

Composio authorization screen for Claude Web, Desktop, and Cowork

3. Connect your Dribbble account

Back in Claude, ask it to connect to Dribbble or give it any Dribbble-related task.

For example, ask Claude to:

  • "Upload new shot from Figma export"
  • "Create project and add selected shots"
  • "List all your unpublished drafts and attachments"

It will prompt you to authenticate and authorize access.

That's it. Composio's tools are now available in Claude, and your Dribbble account is ready to use.

What is the Dribbble Claude Connector, and what's possible with it?

The Dribbble MCP server is an implementation of the Model Context Protocol that connects your AI agent and assistants like Claude, Cursor, etc directly to your Dribbble account. It provides structured and secure access so your agent can perform Dribbble operations on your behalf.

Troubleshooting

1. Why does Claude not use the Composio connector for Dribbble?

The connector can show as connected, but Claude must use it in each Dribbble conversation.

  • Click + at the lower left of the chat, or type /.
  • Hover Connectors.
  • Turn on Composio.
  • Ask Claude to connect to Dribbble again.

2. Why does Claude show an MCP server error before Dribbble connects?

Claude can show Couldn't reach the MCP server or Authorization with the MCP server failed when you add the connector for Dribbble.

  • Check that the connector URL is https://connect.composio.dev/mcp.
  • Connectors run from Anthropic's cloud, so your device network is usually not the problem.
  • Add the connector again from Customize > Connectors, then ask Claude to connect Dribbble.
  • If it fails again, send the error and the ofid_ reference id to support@composio.dev.

3. Why does the Dribbble authorization link not work?

The Composio connector is one server. Your Dribbble account connects separately when Claude asks for it.

  • If the browser does not open, or the link expires, ask Claude to retry the Dribbble connection.
  • Composio creates a fresh Dribbble authorization link.
  • Open that link in your browser and finish the Dribbble sign-in.

4. Why do Dribbble actions fail after they worked before?

The Dribbble connection can expire or lose permission.

  • Ask Claude to inspect the Dribbble connection.
  • If the connection is unhealthy, disconnect it when Claude prompts you.
  • Reconnect the Dribbble account and retry the action.
  • If Claude shows a permission prompt, approve it before Claude changes data in Dribbble.
  • If the action still fails with a permission error, check that the connected account has that permission in Dribbble itself.

5. How do I switch to a different Dribbble account?

Claude can manage the Dribbble connection for you.

  • Ask Claude to disconnect or delete the current Dribbble account.
  • Ask Claude to connect Dribbble again.
  • Open the new Composio authorization link for Dribbble.
  • Sign in with the other Dribbble account in the browser.
  • After the account connects, ask Claude to retry the Dribbble task.

6. Why is my Dribbble connection missing in Claude Desktop or on a Team plan?

The connector belongs to your Claude account, so your Dribbble connection works in Claude Web, Desktop, and Cowork.

  • In Claude Desktop, open Customize > Connectors.
  • Next to Composio, click and click Clear cache.
  • If Dribbble tools still do not appear, click , disconnect, remove the connector, and add it again.
  • On Team or Enterprise, an Owner or Primary Owner must enable the connector before you can connect Dribbble.
TOOLS

Supported Tools

Every Dribbble action and event your agent gets out of the box.

Create Project

Create a project for the connected Dribbble user.

Create Shot

Upload an image to create a public Dribbble shot asynchronously.

Delete Project

Permanently delete a project belonging to the connected Dribbble user.

Delete Shot

Permanently delete a shot owned by the connected Dribbble user.

Delete Shot Attachment

Permanently delete an attachment from a shot owned by the connected Dribbble user.

Get Current User

Return the connected Dribbble user's profile, account capabilities, teams, and shot-upload eligibility.

Get My Shot

Return one shot owned by the connected user, including its media, tags, projects, and attachments.

List My Projects

Return one page of projects belonging to the connected Dribbble user, with a safe cursor for the next page.

List My Shots

Return one page of shots owned by the connected Dribbble user, with a safe cursor and selectable HTML or plain-text description representation.

Update Project

Update the name or description of a project belonging to the connected user.

Update Shot

Update an owned Dribbble shot's metadata and choose the HTML or plain-text description representation returned in the response.

Upload Shot Attachment

Upload a file attachment to an owned Dribbble shot asynchronously.

FAQ

Frequently asked questions

With a standalone Dribbble MCP server, the agents and LLMs can only access a fixed set of Dribbble tools tied to that server. However, with the Composio Tool Router, agents can dynamically load tools from Dribbble and many other apps based on the task at hand, all through a single MCP endpoint.

Yes, you can. Claude Cowork fully supports MCP integration. You get structured tool calling, message history handling, and model orchestration while Tool Router takes care of discovering and serving the right Dribbble tools.

Yes, absolutely. You can configure which Dribbble scopes and actions are allowed when connecting your account to Composio. You can also bring your own OAuth credentials or API configuration so you keep full control over what the agent can do.

All sensitive data such as tokens, keys, and configuration is fully encrypted at rest and in transit. Composio is SOC 2 Type 2 compliant and follows strict security practices so your Dribbble data and credentials are handled as safely as possible.

Start with Dribbble.It takes 30 seconds.

Managed auth, hosted MCP servers, and every Dribbble tool your agent needs.Free to start.

Start building