Figma MCP Server for Mastra AI 12 tools — connect in under 2 minutes
Mastra AI is a TypeScript-native agent framework built for modern web stacks. Connect Figma through the Vinkius and Mastra agents discover all tools automatically — type-safe, streaming-ready, and deployable anywhere Node.js runs.
ASK AI ABOUT THIS MCP SERVER
Vinkius supports streamable HTTP and SSE.
import { Agent } from "@mastra/core/agent";
import { createMCPClient } from "@mastra/mcp";
import { openai } from "@ai-sdk/openai";
async function main() {
// Your Vinkius token — get it at cloud.vinkius.com
const mcpClient = await createMCPClient({
servers: {
"figma": {
url: "https://edge.vinkius.com/[YOUR_TOKEN_HERE]/mcp",
},
},
});
const tools = await mcpClient.getTools();
const agent = new Agent({
name: "Figma Agent",
instructions:
"You help users interact with Figma " +
"using 12 tools.",
model: openai("gpt-4o"),
tools,
});
const result = await agent.generate(
"What can I do with Figma?"
);
console.log(result.text);
}
main();
* Every MCP server runs on Vinkius-managed infrastructure inside AWS - a purpose-built runtime with per-request V8 isolates, Ed25519 signed audit chains, and sub-40ms cold starts optimized for native MCP execution. See our infrastructure
About Figma MCP Server
Figma is the leading collaborative interface design tool. This MCP server allows your AI agent to interact with your Figma files, projects, and teams flawlessly.
Mastra's agent abstraction provides a clean separation between LLM logic and Figma tool infrastructure. Connect 12 tools through the Vinkius and use Mastra's built-in workflow engine to chain tool calls with conditional logic, retries, and parallel execution — deployable to any Node.js host in one command.
Key Features
- File & Node Inspection — Retrieve the full document tree or specific layers to analyze design structures flawlessly.
- Image Rendering — Render Figma frames, components, or layers into PNG, SVG, or PDF images flawlessly native.
- Team & Project Orchestration — List team projects and project files to navigate your design workspace flawlessly.
- Design Token Access — Extract published components, styles, and local variables to sync with codebases flawlessly.
- Collaboration Tools — Read and post comments directly on design files to keep feedback loops active synchronously.
- Version History — Access file version history to track design evolutions flawlessy through the agent.
The Figma MCP Server exposes 12 tools through the Vinkius. Connect it to Mastra AI in under two minutes — no API keys to rotate, no infrastructure to provision, no vendor lock-in. Your configuration, your data, your control.
How to Connect Figma to Mastra AI via MCP
Follow these steps to integrate the Figma MCP Server with Mastra AI.
Install dependencies
Run npm install @mastra/core @mastra/mcp @ai-sdk/openai
Replace the token
Replace [YOUR_TOKEN_HERE] with your Vinkius token
Run the agent
Save to agent.ts and run with npx tsx agent.ts
Explore tools
Mastra discovers 12 tools from Figma via MCP
Why Use Mastra AI with the Figma MCP Server
Mastra AI provides unique advantages when paired with Figma through the Model Context Protocol.
Mastra's agent abstraction provides a clean separation between LLM logic and tool infrastructure — add Figma without touching business code
Built-in workflow engine chains MCP tool calls with conditional logic, retries, and parallel execution for complex automation
TypeScript-native: full type inference for every Figma tool response with IDE autocomplete and compile-time checks
One-command deployment to any Node.js host — Vercel, Railway, Fly.io, or your own infrastructure
Figma + Mastra AI Use Cases
Practical scenarios where Mastra AI combined with the Figma MCP Server delivers measurable value.
Automated workflows: build multi-step agents that query Figma, process results, and trigger downstream actions in a typed pipeline
SaaS integrations: embed Figma as a first-class tool in your product's AI features with Mastra's clean agent API
Background jobs: schedule Mastra agents to query Figma on a cron and store results in your database automatically
Multi-agent systems: create specialist agents that collaborate using Figma tools alongside other MCP servers
Figma MCP Tools for Mastra AI (12)
These 12 tools become available when you connect Figma to Mastra AI via MCP:
get_comments
Get comments on a Figma file
get_file
Use depth to limit node traversal (1=pages only, 2=pages+top frames). Get a Figma file
get_file_nodes
Get specific nodes from a Figma file
get_file_versions
List versions of a Figma file
get_images
Render nodes from a Figma file as images
get_local_variables
List design tokens/variables in a Figma file
get_me
Get details for the authorized Figma user
list_components
List published team components
list_project_files
List files in a project
list_styles
List published team styles
list_team_projects
List projects in a Figma team
post_comment
Post a comment on a Figma file
Example Prompts for Figma in Mastra AI
Ready-to-use prompts you can give your Mastra AI agent to start working with Figma immediately.
"List all projects in my Figma team ID 123456."
"Get the document tree for file key abcDEF123."
"Render nodes 1:2 and 1:5 as PNG images."
Troubleshooting Figma MCP Server with Mastra AI
Common issues when connecting Figma to Mastra AI through the Vinkius, and how to resolve them.
createMCPClient not exported
npm install @mastra/mcpFigma + Mastra AI FAQ
Common questions about integrating Figma MCP Server with Mastra AI.
How does Mastra AI connect to MCP servers?
MCPClient with the server URL and pass it to your agent. Mastra discovers all tools and makes them available with full TypeScript types.Can Mastra agents use tools from multiple servers?
Does Mastra support workflow orchestration?
Connect Figma with your favorite client
Step-by-step setup guides for every MCP-compatible client and framework:
Anthropic's native desktop app for Claude with built-in MCP support.
AI-first code editor with integrated LLM-powered coding assistance.
GitHub Copilot in VS Code with Agent mode and MCP support.
Purpose-built IDE for agentic AI coding workflows.
Autonomous AI coding agent that runs inside VS Code.
Anthropic's agentic CLI for terminal-first development.
Python SDK for building production-grade OpenAI agent workflows.
Google's framework for building production AI agents.
Type-safe agent development for Python with first-class MCP support.
TypeScript toolkit for building AI-powered web applications.
TypeScript-native agent framework for modern web stacks.
Python framework for orchestrating collaborative AI agent crews.
Leading Python framework for composable LLM applications.
Data-aware AI agent framework for structured and unstructured sources.
Microsoft's framework for multi-agent collaborative conversations.
Connect Figma to Mastra AI
Get your token, paste the configuration, and start using 12 tools in under 2 minutes. No API key management needed.
