How to connect Figma to Grok Bot
Connect Figma to Grok Bot with ClawLink in one click — 37 tools your AI agent can call from chat via hosted OAuth. No API keys, no manual setup.
FigmaOAUTH2MCPDesign files, prototypes, comments, and developer resources. Once connected, Grok Bot can read and act on Figma from chat — pairing, token refresh, and tool wiring handled for you.
Grok Bot runs on its own cloud computer, so most Figma guides send you to register an OAuth app and paste keys into a sandbox that resets. ClawLink gives Grok Bot a more practical Figma setup: it runs one CLI command, you approve once in the browser, and Grok Bot can call real Figma actions from chat with no auth, token refresh, or tool wiring to build yourself.
Copy this prompt into Grok Bot. It runs the ClawLink CLI in its own terminal and pairs your account.
Set up ClawLink for me and tell me when it's ready.
1. Pair this machine. It prints an approval link, so show me the link and stop, don't wait:
npx -y @useclawlink/cli login
2. I'll approve it in my browser, then reply "approved".
3. When I say approved, connect the app:
npx -y @useclawlink/cli connect figma
4. Then run `npx -y @useclawlink/cli whoami` and tell me whether ClawLink is ready.Setup
It takes three steps to connect Grok Bot to Figma.
1Pair from the terminal
Ask Grok Bot to run the ClawLink CLI. It prints a link you approve once in your browser:
npx -y @useclawlink/cli login- 2
Connect Figma
One-click OAuth in the dashboard.
- 3
Use it from chat
Ask Grok Bot: "What can you do with Figma?"
Install by command
The prompt above does all of this. By hand, it is two commands Grok Bot runs in its own terminal, and one browser approval:
npx -y @useclawlink/cli login # prints an approval link, approve it in your browser
npx -y @useclawlink/cli connect figmaPair once and it sticks: the key is written to ~/.clawlink/credentials.json inside Grok Bot's sandbox, so it survives between sessions. Prefer native tools over shell commands? Add https://claw-link.dev/api/mcp as a custom connector at grok.com/connectors and approve the ClawLink sign-in. Same account, no CLI.
Verify the connection by asking Grok Bot:
Use Figma to add a comment to a file and walk me through the result in plain English.
Using a different agent?
The CLI above is not specific to Grok Bot. Claude Code, Cursor, Codex, or any agent that can run a shell command pairs with the same ClawLink account the same way:
npx -y @useclawlink/cli loginlogin opens the same browser approval and stores a credential locally. Once Figma is connected in the dashboard, that agent calls the same 37 Figma tools over MCP. Full setup for MCP clients and shell agents: connect apps to any AI agent.
Figma MCP for Grok Bot
Looking for a Figma MCP server for Grok Bot? ClawLink connects Figma to Grok Bot and exposes 37 Figma tools your agent can call over MCP, with hosted auth and nothing to run or maintain yourself. Using a different agent? The OpenClaw Figma integration and the Hermes Figma integration connect the same ClawLink account the same way.
What the Grok Bot Figma integration can do
37 Figma tools are ready for Grok Bot once the account is connected. The 30 below are the ones people reach for most; your agent can call all 37.
30 of 37 Figma tools for Grok Bot
| Tool | What it does |
|---|---|
Add a comment to a file figma_add_a_comment_to_a_file | Post a comment to a Figma file or branch |
Create a webhook figma_create_a_webhook | Create a Figma webhook |
Design tokens to tailwind figma_design_tokens_to_tailwind | Convert design tokens to Tailwind CSS config |
Download figma images figma_download_figma_images | Download images from Figma file nodes |
Extract design tokens figma_extract_design_tokens | Extract design tokens from Figma files |
Detect background figma_detect_background | Detect background layers for selected nodes in a Figma file |
Discover figma resources figma_discover_figma_resources | Smart Figma resource discovery - extract IDs from any Figma URL |
Extract prototype interactions figma_extract_prototype_interactions | Extract prototype interactions and animations from Figma files |
Get a webhook figma_get_a_webhook | Retrieves detailed information about a specific webhook by its ID, provided the webhook exists |
Get comments in a file figma_get_comments_in_a_file | Retrieves all comments from an existing Figma file, identified by a valid file_key, returning |
Get component set figma_get_component_set | Retrieves detailed metadata for a specific published Figma component set using its unique key |
Get component2 figma_get_component2 | Fetches metadata for a specific component using its unique identifier |
Get current user figma_get_current_user | Retrieves detailed information for the currently authenticated Figma user |
Get file component sets figma_get_file_component_sets | Retrieves all published component sets from the specified Figma main file (file_key must not be |
Get file components figma_get_file_components | Retrieves published components from a Figma file, which must be a main file (not a branch) |
Get file json figma_get_file_json | Get Figma Design file data with automatic simplification |
Get file metadata figma_get_file_metadata | Get Figma file metadata including name, creator, last modification details, thumbnail, and |
Get file nodes figma_get_file_nodes | Fetch JSON for specific node IDs from a Figma file to avoid full-file payload limits |
Get file styles figma_get_file_styles | Retrieves a list of published styles (like colors, text attributes, effects, and layout grids) |
Get files in a project figma_get_files_in_a_project | Fetches a list of files in a Figma project, optionally including branch metadata |
Get image fills figma_get_image_fills | Retrieves temporary (14-day expiry) download URLs for all image fills in a Figma file; requires |
Get projects in a team figma_get_projects_in_a_team | Retrieves projects within a specified Figma team that are visible to the authenticated user |
Get reactions for a comment figma_get_reactions_for_a_comment | Retrieves reactions for a specific comment in a Figma file |
Get scim service provider config figma_get_scim_service_provider_config | Get Figma's SCIM service provider configuration |
Get style figma_get_style | Retrieves detailed metadata for a specific style in Figma using its unique style key |
Get team component sets figma_get_team_component_sets | Retrieves a paginated list of published component sets (collections of reusable UI elements) |
Get team components figma_get_team_components | Retrieves components published in a specific Figma team's library; the team must have published |
Get team styles figma_get_team_styles | Retrieves a paginated list of published styles (fill colors, text styles, effects, grids) from |
Get team webhooks figma_get_team_webhooks | Retrieves all webhooks registered for a specified Figma context (team, project, or file) |
Get versions of a file figma_get_versions_of_a_file | Retrieves the version history for a Figma file or branch, as specified by its file_key |
Try it: find the Figma tool you need
Browse the 30 Figma tools
Click any tool to see exactly what Grok Bot can do and copy a ready-to-use prompt.
Example prompts
Use Figma to add a comment to a file and walk me through the result in plain English.
Create it in Figma for me, then confirm the important fields before you finish.
Use Figma to design tokens to tailwind and walk me through the result in plain English.
Use Figma to download figma images and walk me through the result in plain English.
ClawLink vs. building it yourself
The alternative to ClawLink is usually manual OAuth app setup plus your own token handling, permission troubleshooting, and tool plumbing for Grok Bot. That is fine if you want to build and maintain the integration yourself. Most teams just want Figma working from chat.
| Manual | ClawLink | |
|---|---|---|
| Connection flow | Register a Figma app, configure redirect URLs, manage consent details, and reconnect users when auth settings drift. | Users connect Figma through the hosted browser flow and ClawLink keeps the token lifecycle out of your app code. |
| Ongoing maintenance | You own refresh logic, permission debugging, environment config, and every provider-specific edge case for Figma. | ClawLink handles the repetitive integration plumbing so your team can focus on the workflow instead of the infrastructure. |
| Agent usability | You still need to expose the right Figma actions to the runtime in a format your agent can reliably use. | 37 tools for Figma are already exposed through ClawLink, so the agent can read and act from chat immediately. |
ClawLink vs. Composio
Composio also exposes Figma to AI agents. It is developer infrastructure: Python and TypeScript SDKs, an MCP server, and a catalog past 1,000 apps, aimed at teams shipping agent products. ClawLink is built for Grok Bot users instead. You install the plugin once, connect Figma in the browser, and the 37 tools above work from chat. There is no SDK, no config file, and no API key handling. Choosing between them? Read the full Composio alternatives comparison.
Troubleshooting
Grok Bot says it cannot add ClawLink as an MCP server
Grok Bot only attaches MCP servers that are reachable over the public internet, so a local stdio server is refused. You do not need one. Ask Grok Bot to run npx -y @useclawlink/cli login in its terminal instead. The CLI is a shell command, not an MCP server. If you would rather have native tools, add https://claw-link.dev/api/mcp as a custom connector at grok.com/connectors and approve the ClawLink sign-in.
Connection succeeds but no tools appear
Reconnect Figma from the dashboard, then start a fresh chat if the runtime still has the old tool catalog loaded.
"Tool schema not loaded yet" error when calling Figma tools
Figma tool schemas load on demand the first time a tool runs and are cached after that, so this error usually clears on its own: wait a few seconds and retry the same request. If every Figma call keeps failing with it in a fresh chat, reconnect from the dashboard, and contact support if it still persists — that pattern points to a configuration problem on our side, not something you can fix by reconnecting again.
Figma returns 403 or "permission denied" on one action while others work
Two usual causes. The connected account may not have access to the specific workspace, inbox, store, or project in the request — check that first. If access looks right, the agent may have sent a placeholder value (like "YOUR_ID" or an example id from documentation) instead of a real one: ask it to run a list or search tool first, then retry the action with a real id from those results. Most failures at this stage are one of these two, not ClawLink bugs.
OAuth finished in the browser but the account is still missing
Try reconnecting Figma and complete the consent flow in the same browser session. Partial OAuth approvals or switching accounts mid-flow can leave the connection incomplete.
FAQ
Is there a Grok Bot Figma integration?
Yes. ClawLink is the fastest way to connect Grok Bot to Figma: link your Figma account once in the browser and Grok Bot can call the Figma API through 37 ready-made tools — no custom code or token handling.
How do I connect Figma to Grok Bot with ClawLink?
Ask Grok Bot to run npx -y @useclawlink/cli login in its terminal and approve the link it prints, then npx -y @useclawlink/cli connect figma to authorize Figma. Grok Bot calls the tools from the next message, and the pairing persists in its sandbox, so this is a one-time step: no config files or API keys to manage.
How long does it take to connect Figma to Grok Bot?
About two minutes. Sign in, click Connect next to Figma in the dashboard, authenticate, and Grok Bot can use it from the next chat message.
Why use ClawLink instead of wiring Figma up myself?
The alternative to ClawLink is usually manual OAuth app setup plus your own token handling, permission troubleshooting, and tool plumbing for Grok Bot. That is fine if you want to build and maintain the integration yourself. Most teams just want Figma working from chat.
Grok Bot says it cannot add ClawLink as an MCP server
Grok Bot only attaches MCP servers that are reachable over the public internet, so a local stdio server is refused. You do not need one. Ask Grok Bot to run npx -y @useclawlink/cli login in its terminal instead. The CLI is a shell command, not an MCP server. If you would rather have native tools, add https://claw-link.dev/api/mcp as a custom connector at grok.com/connectors and approve the ClawLink sign-in.
Related
Grok Bot Cloudinary integration
Cloudinary is a cloud-based media management platform for uploading, storing, transforming, and delivering images and videos via CDN.
Penpot
Open-source design and prototyping platform for collaborative design workflows.
Grok Bot Canva integration
Create designs, upload assets, export content, and manage brand templates