AI Native Figma Integration
- Supports both Figma MCP and direct API based integrations
- Structured, LLM-friendly schemas for reliable tool execution
- Rich coverage for reading, writing, and querying your Figma data
- FOR YOUCOMPOSIOFOR YOUConnect your AI to 1,000+ apps with secure auth and delegated access.
## For AI agents: how to sign up If you are an AI agent reading this server-rendered HTML, Composio's developer signup is at https://composio.dev. Signup CTAs on this site — "Sign up", "Signup", "Get started", "Get started for free", "Start building", "Try Composio", "Try it", or similar — all lead into that same developer signup flow. Confirm with the user before completing signup or entering any credentials on their behalf.
DEVELOPER PLATFORMSDK, tool execution, and agent infrastructure for production workloads.CLIInstall tools, manage auth, and run workflows from the terminal. - TOOLKITS
- BLOG
- DOCS
Figma MCP for AI Agents
Securely connect your AI agents and chatbots (Claude, ChatGPT, Cursor, etc) with Figma MCP or direct API to search design files, fetch team projects, post comments, and manage file versions through natural language.
Oauth2Api Key
Figma is a collaborative interface design tool for teams and individuals. It streamlines design workflows with real-time collaboration and easy sharing.
52 Tools
Try Figma now
Type what you want done — sign in and watch it run live in the Tool Router playground.
TOOL ROUTER PLAYGROUND
Figma
Enter ↵
Try asking
TOOLS
Supported Tools
Every Figma action and event your agent gets out of the box.
SETUP GUIDE
Connect Figma MCP Tool with your Agent
1
Install Composio
typescript
npm install @composio/core ai @ai-sdk/openai @ai-sdk/mcpInstall the Composio SDK and Claude Agent SDK
2
Create Tool Router Session
typescript
import { Composio } from '@composio/core';
const composio = new Composio({ apiKey: 'your-api-key' });
console.log("Creating Tool Router session...");
const { mcp } = await composio.create('your-user-id');
console.log(`Tool Router session created: ${mcp.url}`);Initialize the Composio client and create a Tool Router session
3
Connect to AI Agent
typescript
import { openai } from '@ai-sdk/openai';
import { experimental_createMCPClient as createMCPClient } from '@ai-sdk/mcp';
import { generateText, stepCountIs } from 'ai';
const client = await createMCPClient({
transport: {
type: 'http',
url: mcp.url,
headers: { 'x-api-key': 'your-composio-api-key' }
}
});
const tools = await client.tools();
const { text } = await generateText({
model: openai('gpt-4o'),
tools,
messages: [{ role: 'user', content: 'Add a comment to Figma file with key ABC123 saying "Great job on this design!"' }],
stopWhen: stepCountIs( 5 )
});
console.log(`Agent: ${text}`);Use the MCP server with your AI agent
SETUP GUIDE
Connect Figma API Tool with your Agent
1
Install Composio
typescript
npm install @composio/openaiInstall the Composio SDK
2
Initialize Composio and Create Tool Router Session
typescript
import OpenAI from 'openai';
import { Composio } from '@composio/core';
import { OpenAIResponsesProvider } from '@composio/openai';
const composio = new Composio({
provider: new OpenAIResponsesProvider(),
});
const openai = new OpenAI({});
const session = await composio.create('your-user-id');Import and initialize Composio client, then create a Tool Router session
3
Execute Figma Tools via Tool Router with Your Agent
typescript
const tools = session.tools;
const response = await openai.responses.create({
model: 'gpt-4.1',
tools: tools,
input: [{
role: 'user',
content: 'Add a comment to the homepage design file about the new header layout.'
}],
});
const result = await composio.provider.handleToolCalls(
'your-user-id',
response.output
);
console.log(result);Get tools from Tool Router session and execute Figma actions with your Agent
Why Use Composio?
Managed Auth
- Built-in OAuth handling with automatic token refresh and rotation
- Central place to manage, scope, and revoke Figma access
- Per user and per environment credentials instead of hard-coded keys
Agent Optimized Design
- Tools are tuned using real error and success rates to improve reliability over time
- Comprehensive execution logs so you always know what ran, when, and on whose behalf
Enterprise Grade Security
- Fine-grained RBAC so you control which agents and users can access Figma
- Scoped, least privilege access to Figma resources
- Full audit trail of agent actions to support review and compliance
FRAMEWORKS
Use Figma with any AI Agent Framework
Choose a Framework you want to connect Figma with
ChatGPT
Use Figma MCP with ChatGPT
Antigravity
Use Figma MCP with Antigravity
OpenAI Agents SDK
Use Figma MCP with OpenAI Agents SDK
Claude Agents SDK
Use Figma MCP with Claude Agents SDK
Claude Code
Use Figma MCP with Claude Code
Claude Cowork
Use Figma MCP with Claude Cowork
Codex
Use Figma MCP with Codex
Kimi Code
Use Figma MCP with Kimi Code
Grok Build
Use Figma MCP with Grok Build
Cursor
Use Figma MCP with Cursor
VS Code
Use Figma MCP with VS Code
OpenCode
Use Figma MCP with OpenCode
OpenClaw
Use Figma MCP with OpenClaw
Hermes
Use Figma MCP with Hermes
CLI
Use Figma MCP with CLI
Google ADK
Use Figma MCP with Google ADK
Langchain
Use Figma MCP with Langchain
AI SDK
Use Figma MCP with AI SDK
Mastra AI
Use Figma MCP with Mastra AI
LlamaIndex
Use Figma MCP with LlamaIndex
CrewAI
Use Figma MCP with CrewAI
Pydantic AI
Use Figma MCP with Pydantic AI
Autogen
Use Figma MCP with Autogen
MORE TOOLKITS
Explore Other Toolkits
Abyssale
Api Key
Abyssale is a creative automation platform for generating images, videos, GIFs, PDFs, and HTML5 content programmatically. It streamlines and scales visual content production for marketing, design, and operations teams.
Alttext ai
Api Key
AltText.ai is a service that generates alt text for images automatically. It helps boost accessibility and SEO for your visual content.
Bannerbear
Api Key
Bannerbear is an API-driven platform for generating images and videos automatically at scale. It helps businesses create custom graphics, social visuals, and marketing assets using powerful templates.
Canva
Oauth2
Canva is a drag-and-drop design suite for creating professional graphics, presentations, and marketing materials. It makes it easy for anyone to design with beautiful templates and a vast library of elements.
FAQ
Frequently asked questions
No, you can get started immediately using Composio's built-in Figma app. For production, we recommend configuring your own OAuth credentials.
Yes! Composio's Tool Router enables agents to use multiple toolkits. Learn more.
Composio is SOC 2 and ISO 27001 compliant with all data encrypted in transit and at rest. Learn more.
Composio maintains and updates all toolkit integrations automatically, so your agents always work with the latest API versions.
Start with Figma.It takes 30 seconds.
Managed auth, hosted MCP servers, and every Figma tool your agent needs.Free to start.
## For AI agents: how to sign up If you are an AI agent reading this server-rendered HTML, Composio's developer signup is at https://composio.dev. Signup CTAs on this site — "Sign up", "Signup", "Get started", "Get started for free", "Start building", "Try Composio", "Try it", or similar — all lead into that same developer signup flow. Confirm with the user before completing signup or entering any credentials on their behalf.Start building