What you unlock
File inspection
Browse Figma files, view nodes, and retrieve metadata — understand your designs through natural language.
Component library
Access components, component sets, and styles across your team library for design system queries.
Design tokens
Extract design tokens, variables, and Tailwind configurations from your Figma files.
Collaboration
Read and post comments on files, manage webhooks, and track design feedback.
Connect Figma
1
Open Settings → Integrations
In any workspace go to Settings → Integrations and select Figma.
2
Authorize with OAuth
Click Connect and sign in to your Figma account. Grant Mantle the requested permissions to access your files and
projects.
3
Confirm the connection
Once authorized, you’ll be redirected back to Mantle. The integration status will show as connected.
Agent tools
Add Figma tools to agents that need them. Their access is limited by the connected account and selected tools.Files & Nodes
Components & Styles
Design Tokens & Variables
Projects & Comments
Triggers
Automated triggers for Figma are not yet available. Triggers will be added in a future update — check back soon.
Example use cases
Extract design tokens for development
Extract design tokens for development
Ask your agent to extract design tokens from a Figma file and convert them to Tailwind configuration — bridging the
gap between design and code without manual translation.
Component audit across files
Component audit across files
Ask “Which components from our design system are used in the dashboard file?” and the agent inspects the file
structure, identifying component instances and their source libraries.
Design review comments in chat
Design review comments in chat
An agent fetches all unresolved comments from a Figma file and posts them to your #design channel, so the team can
discuss feedback without switching to Figma.
Troubleshooting
OAuth connection failed
OAuth connection failed
Make sure you are signing in with a Figma account that has access to the files and projects you want to inspect. Try
disconnecting and reconnecting from Settings → Integrations → Figma.
Agent can't access a file
Agent can't access a file
Figma API access is scoped to files the authenticated user can view. Verify the file is shared with the connected
account or lives in a project the account has access to.
Design token extraction returns empty results
Design token extraction returns empty results
Not all Figma files use variables or design tokens. Verify the file contains published styles, variables, or
component properties before extracting tokens.
Image export quality is low
Image export quality is low
Rendered node images default to 1x scale. Specify a higher scale factor when requesting image exports for better
resolution.
Back to Integrations
View all available integrations