What is Relay?
Relay is a localhost bridge between a coding agent and the Figma desktop app. A Node relay on 127.0.0.1:9226 queues tasks, and a Figma plugin runs them. Eight tools search components, export nodes, set text, fills and strokes, and run custom snippets.
Relay solves a gap the README states bluntly: a coding agent understands your repo but cannot touch your design system, and a Figma plugin has no terminal. Relay is the wire between them.
Three local pieces make it work. An HTTP relay on 127.0.0.1:9226 holds an in-memory task queue, a Figma plugin polls it, and an MCP server exposes the tools over stdio.
What an agent can do with it
- Build. Scaffold new variants, populate slots and wire instance-swap properties.
- Audit. Sweep a page for unbound fills, missing focus states, hand-rolled atoms and accessibility regressions.
- Revise. Mass-rename variants, rebind colors to tokens and restyle whole component sets in one prompt.
Two ways to drive it
The MCP path sends a direct tool call with no model inside the plugin. The in-plugin chat path sends a natural-language instruction to a Haiku agent that uses the same tool whitelist.
That chat panel is the no-terminal mode. It asks for your own Anthropic API key on first launch, stores it in figma.clientStorage per device, and sends it only to api.anthropic.com.
Fit and limits
Best for
- Design system maintainers who want bulk edits such as renames and token rebinding from a prompt.
- People comparing other Figma bridges like Figma Pilot, FigBridge and Figma AI Bridge.
Not for
- Anyone without Figma desktop, since the plugin is imported from a manifest under Development.
- Setups where you cannot run a local server. The relay must be running, and the macOS install adds a LaunchAgent that boots it at login.
Use it with UiChemy
Relay edits and audits a Figma file from the terminal. Once the components are clean, UiChemy's Figma to WordPress can convert the design into an editable WordPress page. Click Get Started on uichemy.com to try that step.
Connect Relay MCP: A Localhost Bridge From Your Terminal to an Open Figma File to your AI client
claude mcp add relay node /absolute/path/to/relay/mcp/server.jsRun the relay server
On macOS run bash scripts/install.sh to drop a LaunchAgent that boots at login and restarts on crash. Or run cd server and npm start by hand. Logs go to ~/Library/Logs/relay.log.
Import the Figma plugin
In Figma desktop choose Plugins, Development, Import plugin from manifest, and pick plugin/manifest.json. Then launch Relay from Plugins, Development. It shows Worker idle until a task arrives.
Install the MCP server
Run cd mcp and npm install, then register it with the Claude Code command above using the absolute path to mcp/server.js.
Confirm the connection
Restart Claude Code, run /mcp, and check that relay is connected. The Claude Code path needs no API key.
Test with a health check
With the plugin running, post a figma.search_components task with an empty query to the relay. It returns every component in the open file.
Endpoints and ports
http://127.0.0.1:9226Local HTTP queue with long-pollhttp://127.0.0.1:9226/healthConfirms the server is upPOST http://127.0.0.1:9226/tasks?wait=true&timeout=60000Blocks until the task reaches a terminal stateWhat you can do with it
- Terminal control of a live fileThe agent works on the Figma document you have open, and results flow back into the chat where you are already writing code.
- Component auditsFind unbound fills, missing focus states, hand-rolled atoms and accessibility regressions across a page.
- Bulk revisionsRename every Checkbox recipe label, rebind colors to tokens or restyle an entire component set in one prompt.
- Everything stays localThe relay listens on 127.0.0.1, holds its queue in memory and keeps no state outside the process.
- Built-in chat panelThe plugin includes a chat with starter prompts and a Haiku agent that has the same figma tools, using a key you supply.
- Live activity feedA tool log in the plugin shows what the agent is doing while it drives the file.
- Extensible tool mapAdd more tools by extending the tools map in plugin/code.js and registering them in mcp/server.js.
Tools it exposes
figma_search_components
Searches COMPONENT and COMPONENT_SET nodes by name.
figma_find_node
Looks up a node by id.
figma_export_node
Exports a node as PNG, JPG, SVG or PDF, returned as base64.
figma_set_text
Replaces the characters of a TEXT node and loads the right font automatically.
figma_set_fills
Replaces the fills array on a node.
figma_set_strokes
Replaces the strokes array on a node.
figma_set_instance_properties
Sets variant, boolean, text and instance-swap properties on an INSTANCE.
figma_execute
An escape hatch that runs arbitrary async snippets inside the plugin sandbox.
Frequently asked questions
What is Relay for Figma?
Relay is a localhost bridge that lets a coding agent act on your open Figma file. A Node relay queues tasks, a Figma plugin runs them, and an MCP server exposes eight figma tools over stdio for searching, exporting, editing and auditing components.
How do I install Relay?
Run the relay server with bash scripts/install.sh on macOS or npm start in server. Import plugin/manifest.json into Figma desktop, run npm install in mcp, then register mcp/server.js with claude mcp add relay node and the absolute path.
Does Relay work with agents other than Claude Code?
The README is written for Claude Code and gives only a claude mcp add command. The MCP server runs over stdio, so another stdio-capable client could launch the same file, but the README does not document that.
Do I need an API key?
Not for the Claude Code path. The no-terminal chat panel inside the plugin asks for your own Anthropic API key, stores it per device in figma.clientStorage, and sends it only to api.anthropic.com. It talks to a Haiku agent.
Can it edit my Figma file?
Yes. Tools set text, fills, strokes and instance properties, and figma_execute runs arbitrary async snippets inside the plugin sandbox. Use a copy of important files first, because the README presents it as direct control of the open document.
Is my data sent to a third party?
The relay and plugin communicate over 127.0.0.1 and hold state in memory. In chat mode, your instructions go to the Anthropic API using the key you provided, and the README says that key is only sent to api.anthropic.com.
How do I check that it is working?
Run curl against the health endpoint on 127.0.0.1:9226, then post a figma.search_components task with an empty query. If the plugin is running, the second call returns every component in the open file.
What license does it use?
MIT. The repository has 7 stars and was last pushed on April 29, 2026, so treat it as a small project and review the code before giving it access to important design files.