Connect Figma to Zeplin
Automate Figma and Zeplin with AI
Zeplin handoff from Figma should stay current when tokens and spacing change mid sprint. Your Operator agent on OpenClaw watches the Figma file for publishes, refreshes the linked Zeplin project, and notifies engineering in chat when specs move to ready for dev. Tell it to audit a component before build and it lists Zeplin screens that disagree with the latest Figma version.
It reaches both apps directly or through connectors like Composio MCP and Pipedream MCP, which handle the sign in and token refresh, so there is no Zap to build and no API keys to paste.
What your agent can do with Figma and Zeplin
What your agent does in Figma
Add a comment to a file
Posts a new comment to a Figma file or branch, optionally replying to an existing root comment (replies cannot be nested); `region_height` and `region_width` in `client_meta` must be positive if defining a comment region.
Add a reaction to a comment
Posts a specified emoji reaction to an existing comment in a Figma file or branch, requiring valid file_key and comment_id.
Create a webhook
Creates a Figma webhook to receive POST notifications when specific events occur. Webhooks can monitor events at three scopes: - Team level: monitors all files in a team (requires team admin permissions) - Project level: monitors all fil...
Create dev resources
Creates and attaches multiple uniquely-URLed development resources to specified Figma nodes, up to 10 per node.
Create, modify, or delete variables
Manages variables, collections, modes, and their values in a Figma file via batch create/update/delete operations; use temporary IDs to link new related items in one request and ensure `variableModeValues` match the target variable's `re...
Delete a comment
Deletes a specific comment from a Figma file or branch, provided the authenticated user is the original author of the comment.
What your agent does in Zeplin
Start OAuth authorization (PKCE)
Tool to start OAuth 2.0 authorization code flow for Zeplin apps. Use when initiating user authorization; call before exchanging the code.
List Project Connected Components
Tool to list connected components in a Zeplin project. Use when you have the project_id and need to retrieve connected components in a specific project.
List Project Colors
Tool to list colors in a Zeplin project. Use when you need to fetch defined color tokens at the project level after obtaining the project ID.
Update Project Color
Tool to update a color in a Zeplin project. Use when you need to modify RGBA channels or source ID of an existing color after confirming the project and color IDs.
Get Zeplin Project by ID
Tool to get a Zeplin project by ID. Use when you need detailed info about a specific project after confirming its project_id.
Invite Project Member
Tool to invite a user to a Zeplin project. Use when you need to add a member by email or username to a project after obtaining the project ID.
How it works
Tell the agent what you want to happen between Figma and Zeplin, for example to watch one and act in the other, or to keep the two in step. It reads what it needs from Figma, works out what to do, and runs the matching action in Zeplin without you mapping a single field.
You can have it run once, on a schedule, or whenever something changes. Ask it for a status any time and it reads the latest from both apps back to you in the same chat.
Common questions about Figma and Zeplin
- How do I connect Figma and Zeplin to Operator?
- You authorize Figma and Zeplin once each from your Operator dashboard. Operator holds both connections and refreshes the access tokens for you, so your agent keeps working across them without you signing in again.
- What can my agent do across Figma and Zeplin?
- You describe the outcome in plain language and your agent works between the two, reading from one and acting in the other. It picks the right Figma and Zeplin actions on its own, so you do not map fields or pick triggers.
- Can my agent keep Figma and Zeplin in sync?
- Yes. It can watch Figma and act in Zeplin, or keep both in step, reading from one and running the matching update in the other. This runs on demand when you ask or on a schedule you set.
- Do I need to build a workflow or write code?
- No. There is no workflow to build, no fields to map, and no API keys to paste. Operator manages both connections, and you give the agent instructions in plain language.
Figma and Zeplin integrations
Put your agent on Figma and Zeplin
Sign in, connect both apps, and hand your agent the work. The same setup reaches every app in the catalog. Your first week is free.
Try for free