MCP.Market

Figma Vector MCP server

by workingmodel·io.github.workingmodel/figma-vector-mcp·v0.3.3

Let Claude create and edit fully editable vector nodes on the Figma canvas.

A92/100grade A
What users say
No reviews yet
Be the first
Safety scan
A92/100

full report

Adoption
Growing

0 stars166 downloads/wk

Reviews

Write one

Nobody has reviewed Figma Vector MCP yet.

If you have run it, two minutes of your experience saves the next person an afternoon.

Figma Vector MCP tools (58, 14 write)

write = sends, deletes, buys or posts

Read from the package source without running it. The installed server may list more.

  • apply_style

    Apply a named document style (paint or text) to a node by style ID.

  • batch_set_propertieswrite action

    Update fill color, stroke color, opacity, position, and/or size on multiple nodes in a single round-trip.

  • boolean_operation

    Perform a boolean operation (union, subtract, intersect, exclude) on 2 or more vector nodes.

  • clone_node

    Duplicate a Figma node, optionally repositioning the clone.

  • create_batchwrite action

    Execute multiple commands in a single round-trip. Commands run sequentially. Each result includes success/error status. Use this for complex compositions (e.g. place an SVG, add a label, group them) to avoid multiple round-trips.

  • create_componentwrite action

    Convert an existing frame or group into a reusable Figma component.

  • create_ellipsewrite action

    Create an ellipse (or circle) on the Figma canvas.

  • create_framewrite action

    Create a Figma frame (container) on the canvas.

  • create_instancewrite action

    Place an instance of a local component on the canvas by component ID.

  • create_maskwrite action

    Apply a clip mask \u2014 maskNode defines the shape, targetNode is clipped to it. Both nodes are grouped.

  • create_pagewrite action

    Create a new page in the Figma document.

  • create_pathwrite action

    Create an editable vector from a single SVG path `d` attribute string. Shorthand for simple paths without a full SVG wrapper.

  • create_polylinewrite action

    Create an editable vector from an array of [x, y] point pairs. Use closed=true to produce a filled polygon.

  • create_rectanglewrite action

    Create a rectangle on the Figma canvas.

  • create_textwrite action

    Create a text node on the Figma canvas. Use width to fix the column width and enable text wrapping.

  • create_vector_from_svgwrite action

    Place a fully editable vector node on the Figma canvas from an SVG string. Supports any valid SVG including paths, polylines, polygons, circles, and groups. The created node is fully editable in Figma.

  • delete_nodewrite action

    Delete a node from the Figma canvas.

  • duplicate_frame_to_page

    Copy a node to a target page at an optional position.

  • export_node_as_png

    Export a Figma node as a base64-encoded PNG at the specified pixel scale.

  • export_node_as_svg

    Export a Figma node as an SVG string. Useful for round-tripping: create a vector, modify it in Figma, export back.

  • find_nodes

    Search for nodes by name (case-insensitive contains) and/or type. Scoped to a page (defaults to current page). Recursive by default.

  • get_available_fonts

    List all fonts available in this Figma environment (system fonts + Figma font agent). Use before create_text to verify a font is loadable. Optionally filter by family name substring.

  • get_components

    List all local components in the Figma document.

  • get_document_info

    Get information about the current Figma document: name, current page, all pages, and top-level nodes.

  • get_library_components

    List components available for use. Returns local document components. Filter by name with optional query.

  • get_node_info

    Get detailed information about a specific node by ID: type, position, size, opacity, children.

  • get_page_list

    List all pages in the current Figma document.

  • get_selection

    Get the currently selected nodes in Figma, including position and size.

  • get_styles

    Get all local paint styles and text styles defined in the Figma document. Use these IDs with apply_style to keep output on-brand.

  • group_nodes

    Group multiple Figma nodes into a group layer.

  • health_check

    Ping the Figma plugin and confirm connectivity. Returns plugin version and current page.

  • join_channel

    Join a named channel on the Figma Vector MCP socket relay. Must be called before any drawing commands if the channel was not set via env/arg.

  • list_colors

    List all color aliases registered in this document's palette.

  • move_node

    Move a Figma node to a new position on the canvas.

  • register_color

    Save a named color alias to the document palette. All RGB values are 0\u20131. Use resolve_color or list_colors to retrieve.

  • register_node

    Save a named alias for a node ID, persisted in the Figma document. Use resolve_node to retrieve it later.

  • rename_node

    Rename a Figma node.

  • reorder_node

    Change a node's Z-order within its parent. Use action for relative moves or index for an absolute position (0 = bottom of stack).

  • resize_node

    Resize a Figma node to the given width and height.

  • resolve_color

    Look up a color by its registered alias. Returns r, g, b, a values (0\u20131).

  • resolve_node

    Look up a node ID by its registered alias. Returns the node ID previously saved with register_node.

  • screenshot_current_page

    Export the current Figma page as a base64-encoded PNG. Useful for visual verification of the canvas state.

  • set_auto_layout

    Enable auto-layout on a frame and configure direction, spacing, padding, and alignment. Set direction to NONE to disable auto-layout.

  • set_blend_mode

    Set the blend mode of a node layer.

  • set_corner_radius

    Set corner radius of a rectangle or frame. Use radius for uniform corners or topLeft/topRight/bottomLeft/bottomRight for individual corners (e.g. pill, tab, card shapes).

  • set_effect

    Apply effects (drop shadow, inner shadow, layer blur, background blur) to a node. Use mode REPLACE (default) to overwrite all effects, or APPEND to add to existing ones.

  • set_fill_color

    Set the fill color of a Figma node.

  • set_focus

    Scroll the Figma viewport to focus on a node and select it.

  • set_gradient_fill

    Apply a gradient fill to a Figma node. Supports LINEAR, RADIAL, ANGULAR (conic), and DIAMOND types. Replaces any existing fills. Stops must be sorted by position (0 \u2192 1).

  • set_image_fill

    Set a node's fill to a base64-encoded image. Use with image generation APIs (Replicate, fal.ai) to place rendered imagery directly on canvas.

  • set_layout_grid

    Apply column, row, or uniform grid guides to a frame.

  • set_opacity

    Set the opacity of a Figma node (0 = invisible, 1 = fully opaque).

  • set_stroke

    Set comprehensive stroke properties on a node: color, weight, position, dash pattern, line cap, and line join.

  • set_stroke_color

    Set the stroke color (and optional weight) of a Figma node.

  • set_text_style

    Modify typographic properties of an existing text node without replacing its content. Also use to set or update text box width and wrapping.

  • set_visibility

    Show or hide a Figma node.

  • switch_page

    Switch to a different page in the Figma document by ID or name.

  • ungroup_nodes

    Ungroup a group node, returning its children to the parent.

Public scan report

scanner v0.1.10 · 2026-10-25 · same rubric, same numbers if you re-run it

no findings
  • Code scan6 source files scanned25/25
  • –Live reliabilityno gateway calls yet and no remote to proben/a
  • –Tool poisoningtools not inspected (local package is not executed); not countedn/a
  • Auth qualitylocal package, no credentials required12/15
  • Maintenancelast push 2 days ago15/15
  • Maintainer identityregistry namespace matches repository owner; GitHub account older than a year8/10
Overall 92/100. Components that don't apply are left out of the denominator. Any critical finding is an F.RubricAppeal a findingJSON

How Figma Vector MCP compares

Against every graded AI and agents MCP server, from our own scans and uptime checks. Updated after each scan run.

Safety score
92/100
higher than 90% of 4,460 AI and agents servers
Tools
58
the typical AI and agents server has 6
Tools that change things
24%
typical: 0%. Fewer write tools means less an agent can break
Downloads a week
166
more than 72% of 1,538 AI and agents servers with a package

What its tools let an agent do: 24 read · 15 create · 17 change · 1 delete · 1 run or deploy

Install Figma Vector MCP in Claude Code, Cursor or VS Code

Runs npx -y figma-vector-mcp on your machine. Read the scan report first; the gateway never runs local packages.

claude mcp add figma-vector-mcp -- npx -y figma-vector-mcp
Add to Cursor

What the publisher says

From the Figma Vector MCP repository's README, as published. We do not edit it. Read it on GitHub

Figma Vector MCP

A Figma plugin + MCP server that lets Claude (or any MCP client) create and manipulate fully-editable vector nodes on the Figma canvas — paths, shapes, gradients, text, effects, image fills, and more — via a local WebSocket relay.

Developed by Working Model Inc

Version 0.3.3 — 58 tools across creation, styling, layout, components, effects, pages, and export.

Why This Exists

cursor-talk-to-figma-mcp is great for reading Figma state and creating basic primitives, but it has no vector path creation, gradient, effects, or compositing tools. This plugin fills that gap:

Architecture

Claude (MCP client)
  ↕ stdio (MCP protocol)
server.ts (MCP server)
  ↕ WebSocket (ws://localhost:3055)
socket.ts (relay — channel-based routing)
  ↕ WebSocket
Figma plugin (ui.html ↔ code.js)
  ↕ postMessage
Figma Plugin API → canvas

The socket relay runs locally. The Figma plugin connects and joins a named channel. The MCP server joins the same channel and sends commands. Results flow back the same path.

AI Agent Quickstart

For AI agents (Claude Code, Cursor, etc.) — the recommended call sequence to start any session:

1. health_check                    → confirm plugin is connected
2. get_document_info               → get page IDs, current page, top-level nodes
3. get_available_fonts             → discover loadable fonts before create_text
4. get_styles                      → load brand colours/text styles if available

Color convention: All RGB values are 0–1 throughout (matching Figma's internal format). r: 1, g: 0, b: 0 = red. Never use 0–255.

Gradient workflow:

1. create_frame({ width, height })          → get frameId
2. set_gradient_fill({ nodeId: frameId, type: "LINEAR", angle: 135,
     stops: [{ color: { r:0.2, g:0.1, b:0.9 }, position: 0 },
             { color: { r:0.9, g:0.2, b:0.4 }, position: 1 }] })

Image fill workflow (with generative AI):

1. Generate image via Replicate/fal.ai → get base64 PNG
2. create_frame({ width: 512, height: 512 })
3. set_image_fill({ nodeId, base64, scaleMode: "FILL" })

Batch compositions — use $prev.id to chain commands without extra round-trips:

{ "commands": [
    { "command": "create_frame", "params": { "width": 400, "height": 300, "name": "Card" } },
    { "command": "set_gradient_fill", "params": { "nodeId": "$prev.id", "type": "LINEAR",
        "stops": [{"color":{"r":0.1,"g":0.1,"b":0.9},"position":0},
                  {"color":{"r":0.8,"g":0.2,"b":0.5},"position":1}] } },
    { "command": "create_text", "params": { "parentId": "$results.0.id",
        "text": "Hello", "fontSize": 32, "x": 24, "y": 24 } }
]}

Known SVG limits: figma.createNodeFromSvg() strips , gradients, filters, masks, and animations. Use setgradientfill for gradients instead of SVG .

Shortened. The full README is on GitHub.

Nothing above is checked by us. What we check is on the safety report.

Figma Vector MCP: common questions

Is Figma Vector MCP server safe?
Yes, by our scan: it is graded A (92/100). Read the Figma Vector MCP safety report
How do I install Figma Vector MCP?
It runs on your machine. Copy the Claude Code, Cursor, VS Code or Claude Desktop config from the install section.
Does Figma Vector MCP need an API key?
No secret keys are declared. It reads 2 settings from the environment.
Is Figma Vector MCP maintained?
The last commit was 12 days ago (2026-10-22). The latest release is v0.3.3.
What can I use instead of Figma Vector MCP?
Servers from other publishers that do the same job: Openflowkit MCP server, Figma Context MCP server and Agent-Native Slides MCP server.
How does Figma Vector MCP compare with other AI and agents MCP servers?
safety score 92/100 (higher than 90% of 4,460 AI and agents servers); tools 58 (the typical AI and agents server has 6); tools that change things 24% (typical: 0%. Fewer write tools means less an agent can break). Full comparison.

Alternatives to Figma Vector MCP

Same job from other publishers: the closest match first, then the best rated.

  • Openflowkit
    Architecture diagrams for your agent: draw on the live OpenFlowKit canvas or edit diagram files.
    A
  • Figma Context
    Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
    B
  • Agent-Native Slides
    Agent-Native Google Slides - generate and edit React presentations
    A
  • CHAP Coordinator
    Auditable records of human decisions over AI agent work. Approvals, edits, overrides, escalations.
    A
  • MCP AutoMem
    Graph-vector memory for AI assistants using FalkorDB and Qdrant
    C