Figma BridgeSAFE
mcp/magic-spells/figma-bridge
Verdict
SAFE
Grade
B
Trust score
89 /100
Exposed tools
93 20r · 61w · 12d
Transport
stdio
License
MIT
Stars
76
01
Overview
From the repository's own README, as read at the audited commit. Badges and raw HTML are left out.
A Model Context Protocol (MCP) server that enables Claude to read and manipulate Figma design files and FigJam files in real-time through a WebSocket bridge to a Figma plugin.
Features
- 93 operations - 68 Figma design tools + 21 FigJam tools (sticky notes, flowchart shapes, connectors, tables, code blocks, link previews) + 4 Prototype tools (reactions, flow starting points)
- Works in both editors, plus read-only Dev Mode - Auto-detects whether you're in a Figma design file or FigJam, and gates editor-specific commands accordingly (FigJam-only sticky/connector/table tools; Figma-Design-only prototype tools). In Dev Mode the plugin runs read-only — see Dev Mode support
- Real-time bidirectional communication - Changes appear instantly in Figma/FigJam
- Token-optimized queries - Efficient variable search and node traversal for AI interactions
- Full Figma API access - Styles, variables, auto-layout, boolean operations, plus FigJam diagrams and documentation
- Built-in skills - Ships its own operating guide as MCP resources (
skill://figma-bridge/SKILL.md); connected agents are directed to read it before write-heavy work, so no separate skill install is needed
Architecture
Claude Code ←──stdio──→ MCP Server ←──WebSocket──→ Figma Plugin ←──→ Figma API (Node.js) localhost:3055 (runs in Figma)
Dev Mode Support
The plugin also runs in Figma Dev Mode (e.g. on a Developer seat, or a view-only file opened in Dev Mode). It appears in the inspect panel's plugin area with a read-only badge next to the port field.
Dev Mode plugins get a read-only document — this is a Figma platform restriction, not a bridge limitation — so only the read tools work there:
figma_get_context,figma_list_pages,figma_get_nodes,figma_get_childrenfigma_search_nodes,figma_search_components,figma_search_styles,figma_search_variables- `figmagetlo
Read from source at commit
123d9e754b27OBSERVED · 2026-10-07Advertisement
02
Connect
Built from this server's own package name, version and transport as found in its source — not copied from anyone's documentation, so it cannot drift against a page we do not control.
claude-code
claude mcp add figma-mcp-bridge -- npx -y @magic-spells/[email protected]
claude-desktop
{
"mcpServers": {
"figma-mcp-bridge": {
"command": "npx",
"args": [
"-y",
"@magic-spells/[email protected]"
]
}
}
}03
Exposed tools (93)
20 read · 61 write · 12 destructive. Blast radius: 12 tools can delete or overwrite — an agent that can be talked into calling a tool can be talked into calling this one.
| Tool | Risk | Description |
|---|---|---|
figma_add_mode | write | Add a new mode to a variable collection. |
figma_add_reaction | write | |
figma_apply_style | write | Apply a local style to a node. Styles provide consistent, reusable design tokens. Works for all five style |
figma_clone_nodes | read | Duplicate nodes. |
figma_combine_as_variants | write | Combine multiple components into a component set with variants. Components must use variant naming (e.g., |
figma_create_code_block | write | FigJam only: create a syntax-highlighted code block for documentation. Code is a plain string property (no font loading required). |
figma_create_component | write | Create a component. |
figma_create_connector | write | |
figma_create_ellipse | write | Create ellipse. Use arcData for arcs/rings. |
figma_create_frame | write | Create a frame. |
figma_create_instance | write | Create a component instance. |
figma_create_line | write | Create a line. |
figma_create_link_preview | write | FigJam only: create a rich link preview from a URL. Returns either an EMBED (iframe; works for OEmbed providers like YouTube/Spotify) or a LINK_UNFURL (rich card from OpenGraph/Twitter Card metadata) — the response includes nodeType so you know which. |
figma_create_page | write | Create a new page in the document. **Figma Design only — not available in FigJam.** Calling this in a FigJam file returns a FIGMA_DESIGN_ONLY error. FigJam files have pages but the plugin API does not expose figma.createPage(); pages must be created via the FigJam UI. |
figma_create_paint_style | write | Create a paint style. |
figma_create_rectangle | write | Create a rectangle. |
figma_create_section | write | Create a labeled section. Sections work in BOTH Figma design files and FigJam — use them to group flowcharts, diagrams, or design areas. Supports dev status (READY_FOR_DEV/COMPLETED) for handoff. |
figma_create_shape_with_text | write | FigJam only: create a flowchart shape with embedded text (process box, decision diamond, database cylinder, etc.). 30 shape types are available — use ROUNDED_RECTANGLE for processes, DIAMOND for decisions, ENG_DATABASE for data stores. cornerRadius is fixed and cannot be set. |
figma_create_sticky | write | FigJam only: create a sticky note. Default size is fixed (240×240); width/height are not configurable. Text is set via the embedded sublayer (font auto-loaded). Note: the author name and visibility are auto-populated by Figma from the active user — they cannot be set programmatically. |
figma_create_table | write | FigJam only: create a table for documentation or structured data. Optionally seed initial cell content via the cells array. Defaults to 2×2. |
figma_create_text | write | Create a text node. |
figma_create_text_style | write | Create a text style. |
figma_create_variable | write | Create a new variable in a collection. |
figma_create_variable_collection | write | Create a new variable collection to organize variables. |
figma_delete_mode | destructive | Delete a mode from a variable collection. Cannot delete the last mode. |
figma_delete_nodes | destructive | Delete nodes. |
figma_delete_page | destructive | Delete a page from the Figma document. Cannot delete the last remaining page. |
figma_delete_style | destructive | Delete a local style (paint, text, effect or grid) from the document. Only local styles can be deleted — styles from a subscribed library return a REMOTE_STYLE error. Use with caution: nodes using the style keep their resolved values but lose the link. Find style IDs with figma_search_styles. |
figma_delete_variable_collection | destructive | Delete a variable collection and all its variables. Use with caution - this cannot be undone. |
figma_delete_variables | destructive | Delete one or more variables from the document. Use with caution - this cannot be undone. |
figma_detach_instance | read | Detach a component instance, converting it to a regular frame. Preserves overrides but severs the link to the main component. |
figma_duplicate_page | read | Clone an entire page including all its contents. The new page is inserted after the original. **Figma Design only — not available in FigJam.** Returns FIGMA_DESIGN_ONLY in FigJam since the underlying figma.createPage() API is not exposed there. |
figma_export_node | read | Export a node as an image (PNG, SVG, JPG, or PDF). The image is WRITTEN TO DISK and the file path is returned — |
figma_get_children | read | Get immediate children of a node. Use for browsing hierarchy one level at a time. More efficient than figma_get_nodes for exploring structure. Compact results include x/y, so they can be used to measure layout (e.g. which children share a row after wrapping). Composite instance-sublayer parent IDs ( |
figma_get_context | read | Get the current Figma document context including file info, current page, and selection. Use this to understand what document is open and what the user has selected. |
figma_get_local_styles | read | List all local styles defined in the document (colors, text, effects, grids). TIP: Use figma_search_styles instead when looking for specific styles by name - it returns compact results and reduces token usage. |
figma_get_local_variables | read | Get all local variables and variable collections from the Figma document. Returns variables with their types (COLOR, FLOAT, STRING, BOOLEAN), modes, and values. WARNING: Can return 25k+ tokens and may be truncated. Use figma_search_variables instead when looking for specific variables. |
figma_get_nodes | read | Get detailed information about specific Figma nodes by their IDs. Returns node properties including type, position, size, fills, strokes (strokeWeight reads |
figma_get_reactions | read | Prototype (Figma Design only): get all reactions (interactions) on a node. Returns the full reactions array with trigger and action details. |
figma_group_nodes | read | Group nodes. |
figma_insert_table_column | write | FigJam only: insert a column at the given index (existing columns at and after the index shift right). |
figma_insert_table_row | write | FigJam only: insert a row at the given index (existing rows at and after the index shift down). |
figma_list_pages | read | List all pages in the current Figma document. Returns page IDs, names, and indicates which page is currently active. |
figma_move_nodes | write | Move nodes. Use relative=true for offset. |
figma_move_table_column | write | FigJam only: move a column from one index to another. |
figma_move_table_row | write | FigJam only: move a row from one index to another. |
figma_move_to_page | write | Move nodes from their current page to a different page. |
figma_remove_reaction | destructive | Prototype (Figma Design only): remove a reaction from a node by its zero-based index in the reactions array. Use figma_get_reactions first to find the index. |
figma_remove_table_column | destructive | FigJam only: remove the column at the given index. |
figma_remove_table_row | destructive | FigJam only: remove the row at the given index. |
figma_rename_mode | write | Rename a mode in a variable collection (e.g., |
figma_rename_node | write | Rename one or more nodes. For batch renaming, all nodes get the same name. |
figma_rename_page | write | Rename an existing page in the Figma document. |
figma_rename_variable | write | Rename an existing variable. Use |
figma_rename_variable_collection | write | Rename a variable collection. |
figma_reorder_node | write | Change the z-order (layer order) of a node among its siblings. A numeric position is the FINAL index the node |
figma_reparent_nodes | write | Move nodes to a different parent container. Useful for reorganizing the layer hierarchy. |
figma_resize_nodes | read | Resize one or more nodes to an explicit pixel size. At least one dimension (width or height) must be provided. |
figma_resize_table_column | write | FigJam only: set the width of a table column. |
figma_resize_table_row | write | FigJam only: set the height of a table row. |
figma_search_components | read | Search local components by name. Use when looking for specific components like |
figma_search_nodes | read | Search for nodes by name within a scope. PREFERRED for finding specific frames, sections, or elements. Requires parentId to scope search. Returns compact results (~50 tokens/node vs ~500 for full). |
figma_search_styles | read | Search local styles by name. More efficient than figma_get_local_styles when looking for specific styles. |
figma_search_variables | read | Search for variables by name pattern. More efficient than get_local_variables - use this when looking for specific variables like |
figma_server_info | read | Get information about the MCP server: package version, WebSocket port, connection state, and connected document info. |
figma_set_auto_layout | write | Configure auto-layout on a frame. Enables responsive layouts with automatic spacing and alignment. |
figma_set_clips_content | write | Set whether frame-like nodes clip their children to the frame bounds. Works on FRAME, COMPONENT, COMPONENT_SET, INSTANCE, SLOT and SLIDE — other node types return an error. Response echoes the resulting clipsContent. Read it back with figma_get_nodes. |
figma_set_code_block | write | FigJam only: update an existing code block\ |
figma_set_connector | write | FigJam only: modify an existing connector\ |
figma_set_constraints | write | Set resize constraints on a node. Constraints control how a node resizes when its parent frame resizes. Only works on nodes inside frames (not auto-layout frames). |
figma_set_corner_radius | write | Set corner radius. Use individual values for asymmetric. |
figma_set_current_page | write | Switch to a different page in the Figma document. |
figma_set_effects | write | Set effects. Replaces existing. |
figma_set_fills | write | Set fill color. Accepts hex shorthand or fills array. |
figma_set_flow_starting_point | write | Prototype (Figma Design only): set a top-level frame as a prototype flow starting point on the current page, or clear it. Flow starting points are page-level — Figma stores them as { nodeId, name } entries on the page. |
figma_set_layout_align | write | Set how a child behaves within an auto-layout frame. Controls individual alignment (STRETCH), growth (fill container), and absolute positioning. |
figma_set_opacity | write | Set opacity (0-1). |
figma_set_rotation | write | Set the rotation (in degrees) of one or more nodes. pivot defaults to |
figma_set_section | write | Update a section\ |
figma_set_selection | write | Set selection. Empty array clears. |
figma_set_shape_type | write | FigJam only: change the shape type of an existing shape-with-text node (e.g., turn a ROUNDED_RECTANGLE into a DIAMOND). |
figma_set_size_limits | destructive | Set or CLEAR the min/max size limits (minWidth, maxWidth, minHeight, maxHeight) on one or more nodes. |
figma_set_sticky | write | FigJam only: toggle a sticky note between square (240×240) and wide-rectangle variants. Use figma_set_text to change the body text. (Author name/visibility are read-only at runtime — Figma sets them from the active user.) |
figma_set_strokes | write | Set stroke color and/or weight. Accepts hex shorthand or strokes array. Supports per-side weights (strokeTopWeight etc.) for border-top-only style dividers — no need to fake them with 1px rectangles. Omit |
figma_set_table_cell | write | FigJam only: set the text and/or fill color of a single table cell. |
figma_set_text | write | Set text content. Auto-loads fonts. |
figma_set_text_style | write | Set text font properties. |
figma_set_variable | write | |
figma_set_variable_mode | destructive | Pin an explicit variable mode on nodes or pages, or clear an existing pin. This is how a preview/page frame is made to resolve a particular mode (e.g. a mobile frame pinned to the Spacing collection\ |
figma_set_visible | write | Show or hide nodes. Sets node.visible directly — use this instead of binding a BOOLEAN variable or setting opacity to 0 just to hide something. Response echoes each node\ |
figma_swap_instance | read | Swap a component instance to use a different component. Preserves position and size. |
figma_unbind_variable | destructive | Remove a variable binding from a node property. The unbind is verified by readback (UNBIND_FAILED if the field is |
figma_ungroup_nodes | read | Ungroup nodes. |
04
Trust audit
SAFEgrade B · trust 89/100 Nothing in the source contradicts what it says it does. Grade A is reserved for packages that have also passed the behavioural sandbox.
| Layer | What it checks | Result |
|---|---|---|
| L0 | Provenance & inventory | PASS |
| L1 | Static analysis of the code | PASS |
| L2 | Instruction surface (what it tells the agent) | PASS |
| L3 | Class-specific surface | WARN |
| L4 | Behavioural (sandbox) | SKIPPED |
What the source does
- Filesystem
- declared (1 observation(s))
- Network
- declared (5 observation(s))
- Shell
- none-observed
- Dependencies
- not all pinned
- Secrets in source
- none-found
Findings (2)
MEDIUMFilesystem / path · mcp.destructive_tools · CWE-22, CWE-59
figma_delete_mode, figma_delete_nodes, figma_delete_page, figma_delete_style, figma_delete_variable_collection, figma_delete_variables, figma_remove_reaction, figma_remove_table_column, figma_remove_t
Why it matters. 12 tool(s) can delete or overwrite
Fix. prefer a read-only mode or scoped tokens; the page states the blast radius
LOWSupply chain · supply.unpinned · CWE-829, CWE-1357
package.json
@modelcontextprotocol/sdk, ws
Why it matters. 2 dependency range(s) float
Fix. pin exact versions or ship a lockfile
Gates applied: no_behavioural_pass.
Audited 2026-10-07 · audit v0.4.1 · source sha
123d9e754b27full audit observations/trust-audit/mcp-server/magic-spells__figma-bridge.json · Report an issue / request a re-scan05
Audit history
Every audit this server has had. A grade with a past is a grade somebody is still checking.
| Date | Source | Verdict | Grade | Score | Change |
|---|---|---|---|---|---|
| 2026-10-07 | 123d9e754b27 | SAFE | B | 89 | first audit |
06
Questions
What tools does Figma Bridge expose?
93 in total: 20 read-only, 61 that write, and 12 that can delete or overwrite (figma_delete_mode, figma_delete_nodes, figma_delete_page, figma_delete_style, figma_delete_variable_collection). Every one is listed on this page with its risk.
Is Figma Bridge safe to connect to an agent?
The audit found nothing in the source that contradicts what it says it does, and graded it B (89/100). Grade A is held back for packages that have also passed a sandboxed behavioural run, which is why a clean server reads B. Separately from the audit: 12 of its tools can destroy data, so scope the token you give it to what you actually need.
What credentials does Figma Bridge need?
No credential environment variables were found in its source, so it appears to need none.
How does Figma Bridge run?
It speaks stdio, so it runs as a local process your client starts. It is published on npm as @magic-spells/figma-mcp-bridge at 0.4.0.
How current is this page?
The grade is for one exact copy of the source (123d9e754b27), read on 2026-10-07. The repository is watched and re-audited when it changes.