Arrange nodes on a FigJam board in a grid, horizontal row, or vertical column layout. Use after batch-creating elements to organize them neatly.

Number of columns for grid layout (defaults to sqrt of node count)

Layout type: grid, horizontal, or vertical

Array of node IDs to arrange (max 500)

Spacing between nodes in pixels

Create a code block on a FigJam board. Use for sharing code snippets, config examples, or technical documentation in collaborative boards.

The code content

Programming language (e.g., 'JAVASCRIPT', 'PYTHON', 'TYPESCRIPT', 'JSON', 'HTML', 'CSS')

X position on canvas

Y position on canvas

Connect two nodes with a connector line in FigJam. Use to create flowcharts, diagrams, and relationship maps.

Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from creation results.

**Magnet positions:** AUTO (default), TOP, BOTTOM, LEFT, RIGHT — controls where the connector attaches to each node.

Magnet position on the end node

Node ID of the end element

Optional text label on the connector

Magnet position on the start node

Node ID of the start element

Create a section on a FigJam board. Sections are containers that can hold other elements. Use for grouping related content.

**Note:** After creating a section, place elements inside it by setting their x/y coordinates within the section's bounds, then use figma_execute to call section.appendChild(node) to parent them.

Fill color as hex

Section height in pixels

Section name/title

Section width in pixels

X position on canvas

Y position on canvas

Create a labeled shape on a FigJam board with optional size, colors, and font control. Use for flowchart nodes, process diagrams, and visual organization.

**Shape types:** ROUNDED_RECTANGLE (default), DIAMOND, ELLIPSE, TRIANGLE_UP, TRIANGLE_DOWN, PARALLELOGRAM_RIGHT, PARALLELOGRAM_LEFT, ENG_DATABASE, ENG_QUEUE, ENG_FILE, ENG_FOLDER

Fill color as hex (e.g., '#E1F5EE')

Text font size in pixels

Height in pixels

Shape type

Stroke/border color as hex

Dash pattern as comma-separated numbers (e.g., '10,5' for dashed)

Text label for the shape

Width in pixels

X position on canvas

Y position on canvas

Batch create multiple sticky notes on a FigJam board (max 200). Use this to populate boards from structured data (meeting notes, brainstorm ideas, etc.).

**Colors:** YELLOW, BLUE, GREEN, PINK, ORANGE, PURPLE, RED, LIGHT_GRAY, GRAY

Array of sticky note specifications (max 200)

Sticky color

YELLOW BLUE GREEN PINK ORANGE PURPLE RED LIGHT_GRAY GRAY

Text content

X position

Y position

Create a sticky note on a FigJam board. Only works in FigJam files.

**Colors:** YELLOW, BLUE, GREEN, PINK, ORANGE, PURPLE, RED, LIGHT_GRAY, GRAY (default: YELLOW)

Sticky color

Text content for the sticky note

X position on canvas

Y position on canvas

Create a table on a FigJam board with optional cell data. Use for structured data display, comparison matrices, and organized information.

**Data format:** 2D array of strings, e.g. [["Header1", "Header2"], ["Row1Col1", "Row1Col2"]]

Number of columns (1-50)

2D array of cell text content (row-major order)

Number of rows (1-100)

X position on canvas

Y position on canvas

Read all content from a FigJam board. Returns stickies, shapes, connectors, tables, code blocks, and sections with their text content and positions.

Use this to understand what's on a board before modifying it, or to extract structured data from collaborative sessions.

**Filters:** Pass nodeTypes to limit results (e.g., ["STICKY"] for only stickies). Omit for everything.

Maximum nodes to return (1-1000, default: 500)

Filter by node types. Omit for all.

STICKY SHAPE_WITH_TEXT CONNECTOR TABLE CODE_BLOCK SECTION FRAME TEXT

Read the connection graph from a FigJam board. Returns all connectors with their start/end node references and labels.

Use this to understand relationships, flowcharts, and diagrams. Returns edges as {startNodeId, endNodeId, label} plus a summary of connected nodes.

Add a new component property to a component or component set. Properties enable dynamic content and behavior in component instances. Supported types: BOOLEAN (toggle), TEXT (string), INSTANCE_SWAP (component swap), VARIANT (variant selection), SLOT (freeform slot — prefer figma_create_slot for new slots).

Default value. Required for TEXT (string), INSTANCE_SWAP (component id), and VARIANT (a non-empty variant option name — Figma rejects empty). Optional for BOOLEAN (defaults false). Omit for SLOT.

Property description (SLOT properties only)

The component or component set node ID

Preferred components (INSTANCE_SWAP and SLOT only)

Name for the new property (e.g., 'Show Icon', 'Button Label', 'Content')

Property type: BOOLEAN for toggles, TEXT for strings, INSTANCE_SWAP for component swaps, VARIANT for variant selection, SLOT for freeform slot areas

Add a new mode to an existing Figma variable collection. Modes allow variables to have different values for different contexts (e.g., Light/Dark themes, device sizes). Requires the Desktop Bridge plugin to be running.

The collection ID to add the mode to (e.g., 'VariableCollectionId:123:456'). Get this from figma_get_variables.

The name for the new mode (e.g., 'Dark', 'Mobile', 'High Contrast').

Add a rectangle or ellipse shape to a specific slide with optional fill color.

Hex color e.g. '#FF5733'

Height in pixels

Shape type

The node ID of the slide

Width in pixels

X position

Y position

Manually add a SLOT component property and bind it to an existing frame (alternative to figma_create_slot). The frame must be a direct child of the component, must not use GRID layout, and must not be nested inside another slot. Supports description and preferredValues.

Slot property description (SLOT-only)

Frame node ID to bind as the slot content area

COMPONENT or COMPONENT_SET node ID

Preferred components for slot content (SLOT-only)

Component or component set key

Type of preferred value

Slot property name (e.g. 'Content')

Add a new text element to a specific slide. Supports custom fonts, colors, alignment, and text formatting.

Text fill color as hex (e.g., '#FFFFFF')

Font family (e.g., 'Manrope', 'IBM Plex Sans')

Font size in pixels

Font style/weight (e.g., 'Bold', 'SemiBold', 'Medium')

Letter spacing in pixels

Line height in pixels

The node ID of the slide

The text content

Horizontal text alignment

Text case transformation

Text box width for wrapping. When set, enables text wrapping.

X position

Y position

Analyze a Figma COMPONENT_SET to extract variant state machine and cross-variant diffs for code generation. Returns: (1) variant axes (size, state) with all values, (2) CSS pseudo-class mappings for interaction states (hover→:hover, focus→:focus-visible, disabled→:disabled, error→[aria-invalid]), (3) visual diff from default state per variant (only changed properties — fill token, stroke token, stroke weight, text color, opacity, effects, visibility), (4) component property definitions mapped to code props (BOOLEAN→boolean, TEXT→string, INSTANCE_SWAP→slot/ReactNode), and (5) slots — Figma SLOT properties (name, preferredValues = the components a slot accepts, and limitViolations) to implement as named slots / children props (React {children} or named ReactNode; Web Components <slot name>). Use this on the parent COMPONENT_SET node, not individual variants. Requires Desktop Bridge plugin.

COMPONENT_SET node ID (the parent of all variants, e.g., '214:274')

Add content to a slot on a component instance. Clones sourceNodeId into the slot, or creates a new node (nodeType). SLOT content cannot be set via figma_set_instance_properties — use this tool instead. Widgets, stickies, and raw ComponentNodes cannot be appended to slots.

Remove existing slot children before appending

When using sourceNodeId, clone the node (default true). Set false to move.

Instance ID — use with slotName when slotId is unknown

Create a new node in the slot instead of cloning

FRAME RECTANGLE ELLIPSE TEXT LINE POLYGON STAR VECTOR

Properties for created nodes: name, text, width, height

Direct SlotNode ID (from figma_get_slots)

Slot layer name on the instance (e.g. 'Content')

Node to clone into the slot (default: clone=true)

Organize a component set with Figma's native purple dashed visualization. Use after creating variants, adding states (hover/disabled/pressed), or when component sets need cleanup.

Non-destructive: rearranges the existing variants in place (grid positions on the existing set's children), so the component set keeps its node ID and all placed instances remain intact. Arranges variants in a labeled grid (columns = last property like State, rows = other properties like Type+Size) and wraps the set in a white container with title, row/column labels. Safe to run on component sets with placed instances, and safe to re-run.

Node ID of the component set to arrange. If not provided, will look for a selected component set.

Name of the component set to find. Used if componentSetId not provided.

Layout options

Padding inside each cell around the variant (default: 20)

Property to use for columns (default: auto-detect last property, usually 'State')

Gap between grid cells in pixels (default: 24)

Deep accessibility audit for a specific component or component set. Produces a scorecard covering: state coverage (default/hover/focus/disabled/error/active/loading), focus indicator quality and contrast, non-color differentiation (WCAG 1.4.1), target size consistency (WCAG 2.5.8), annotation completeness, and color-blind simulation (protanopia/deuteranopia/tritanopia). Returns per-category scores (0-100) and prioritized recommendations. Use after designing a component to validate accessibility before handoff. Requires Desktop Bridge plugin.

Node ID of a COMPONENT_SET, COMPONENT, or INSTANCE to audit. Falls back to current selection if omitted.

Minimum touch target size in px (default: 24 per WCAG 2.5.8). Use 44 for iOS or 48 for Android guidelines.

Run the design-system health audit and return the scored report as data (no UI required). Same deterministic engine as the Design System Dashboard app: naming & semantics, token architecture, component metadata, accessibility, consistency, coverage — each 0-100 plus a weighted overall. Start with the default summary, then drill into one category at a time via `category` (chunked; avoids one giant payload). Results are cached ~5 minutes; pass forceRefresh after editing the file. Every finding includes whether this MCP can fix it (design-side write tools vs. design decision vs. manual).

Return full findings (including passes, examples, locations) for ONE category — the chunked drill-down path after a summary call.

naming-semantics token-architecture component-metadata accessibility consistency coverage

Figma file URL. If not provided, uses the currently active file.

Bypass the 5-minute audit cache and re-crawl the file. Only needed after editing the file.

'summary' (default) — bounded readable report: overall + category scores + non-pass findings + remediation. 'full' — complete scored JSON (examples/locations clamped); prefer per-category calls over 'full' when working interactively.

Create multiple variables in one operation. Use instead of calling figma_create_variable repeatedly — up to 50x faster for bulk operations. Get collection IDs from figma_get_variables first. Requires Desktop Bridge plugin.

Collection ID to create all variables in (e.g., 'VariableCollectionId:123:456')

Array of variables to create (1-100)

Optional description

Variable name (e.g., 'primary-blue')

Variable type

Values by mode ID. For COLOR: hex like '#FF0000'. Example: { '1:0': '#FF0000' }

Update multiple variable values in one operation. Use instead of calling figma_update_variable repeatedly — up to 50x faster for bulk updates. Get variable/mode IDs from figma_get_variables first. Requires Desktop Bridge plugin.

Array of updates to apply (1-100)

Mode ID (e.g., '1:0')

New value. COLOR: hex like '#FF0000'. FLOAT: number. STRING: text. BOOLEAN: true/false.

Variable ID (e.g., 'VariableID:123:456')

Find the version that introduced a specific change to a node — answers 'who/when added this'. Walks version history backward via binary search (~log2(N) API calls instead of N) to localize the introduction point. Returns the version's metadata (label/author/timestamp). Default includes autosaves for finer attribution; system 'Figma' user appears occasionally for scheduled snapshots and is flagged via attribution_certainty='system_attributed'. Specify EXACTLY ONE of target_component_property or target_child_node_id. node_id is optional — if omitted, falls back to the first node in the current Figma selection.

Figma file URL. Uses current URL if omitted.

Include auto-saved versions in the search range. Default true (better attribution accuracy; most autosaves carry the real human user).

Lookback cap. Binary search probes ~log2(N) of these. Default 200, max 500.

The parent node ID to inspect (typically a COMPONENT_SET). If omitted, falls back to the first node in the current Figma selection.

Version to walk backward from. Default 'current' (HEAD).

A descendant node ID — find when this child was first added under node_id.

A componentPropertyDefinitions key (e.g. 'Disabled#1:2') — find when this property was first added to the node.

Capture a screenshot of a node using the plugin's exportAsync API. IMPORTANT: This tool captures the CURRENT state from the plugin runtime (not cloud state like REST API), making it reliable for validating changes immediately after making them. Use this instead of figma_get_component_image when you need to verify that changes were applied correctly. Defaults are AI-optimized: PNG at 1x with automatic downscaling so the longest side stays within the 1568px AI vision processing ceiling. PNG is the default because design tool content (flat colors, text, UI components) compresses significantly better as PNG. Use JPG for photographic or gradient-heavy content. Requires Desktop Bridge connection (Figma Desktop with plugin running).

Image format (default: PNG). Use JPG for photographic or gradient-heavy content.

ID of the node to capture (e.g., '1:234'). If not provided, captures the current page.

Scale factor (default: 1). The plugin automatically caps the effective scale so the exported image does not exceed 1568px on its longest side (the AI vision processing ceiling).

Compare a Figma component's design specs against code-side data to find discrepancies. Returns a parity score, categorized discrepancies, and actionable fix items for both design-side (Figma tool calls) and code-side (file edits). Read the component source code first, then pass the data in codeSpec.

Which source is the canonical truth. Fixes will target the other side. Default: 'design'

Structured code-side component data. Read the component source code first, then fill in the relevant sections.

Accessibility properties from code. Tip: use figma_scan_code_accessibility with mapToCodeSpec:true to auto-generate this from component HTML.

Rendered size [width, height] in px

Semantic HTML element (e.g., 'button', 'a', 'input')

Whether code supports disabled/aria-disabled state

Whether code supports aria-invalid/error state

Component API (props, events, slots)

Path to the component source file

Component metadata from code

Spacing and layout properties from code

Design token usage in code

Typography properties from code

Visual properties from code (colors, borders, effects)

Enable token coverage and enrichment analysis. Default: true

Figma file URL. Uses current URL if omitted.

Component node ID (e.g., '695:313')

Clear the console log buffer. Safely clears the buffer without disrupting the connection. Returns number of logs cleared.

Duplicate a node. The clone is placed at a slight offset from the original.

The node ID to clone

Create a new child node inside a parent container. Always place inside an existing Section or Frame — never on a bare page. If no suitable parent exists, create a Section first. Clean up any empty or orphaned nodes if the operation fails.

Type of node to create

The parent node ID

Properties for the new node

Fill colors (hex strings)

Height (default: 100)

Name for the new node

Text content (for TEXT nodes only)

Width (default: 100)

X position within parent

Y position within parent

Create a component set with variants in one call — replaces hand-written figma.combineAsVariants scripts.

Two modes:
1. **Generate from a base component**: pass baseComponentId + properties (variant axes). The base is cloned for every combination of the axes ({ State: ['default','hover','disabled'], Size: ['sm','lg'] } → 6 variants), each named 'Prop=Value' comma-joined (e.g. 'State=hover, Size=sm'), then combined into a set. The base component itself becomes the FIRST variant (same node ID), so existing instances of the base survive as instances of that variant.
2. **Combine existing components**: pass componentIds, optionally with variantProperties (aligned 1:1) to rename each component to Prop=Value form before combining.

Figma derives the variant property definitions from the names; they live on the SET (componentPropertyDefinitions), not on individual variants. The result includes each variant's key — instantiate with a VARIANT's key/nodeId via figma_instantiate_component, not the set's key.

Set autoArrange:true to lay the new set out as a labeled grid inside a white container (same layout as figma_arrange_component_set). Requires Desktop Bridge plugin.

SIZE GUIDANCE: hard cap 100 variants. The timeout auto-scales with variant count (~1.2s/variant, 30s floor / 2min cap), but above ~40 variants the single-pass clone+combine gets slow and heavy base components may still push the limit — prefer splitting large matrices into multiple sets (e.g. one set per Size).

Grid layout options, used when autoArrange is true.

Padding inside each cell around the variant (default: 20)

Property to use for columns (default: last property)

Gap between grid cells in pixels (default: 24)

If true, arrange the new set in a labeled grid (columns = last property, rows = other properties) inside a white container — same in-place layout as figma_arrange_component_set.

Node ID of an existing COMPONENT to use as the base. Cloned per property combination; becomes the set's first variant (keeps its node ID, so placed instances survive). Mutually exclusive with componentIds.

Node IDs of existing COMPONENT nodes to combine as variants. Mutually exclusive with baseComponentId. Components already inside a component set are rejected.

Name for the component set (e.g., 'Button'). Defaults to Figma's derived name.

Node ID of the container (frame/section) to create the set in. Defaults to the current page.

Position of the set within its parent.

Variant property axes — required with baseComponentId. Example: { State: ['default','hover','disabled'], Size: ['sm','lg'] } creates 6 variants. Max 100 combinations. Names and values must not contain '=' or ','.

Only with componentIds: one property map per component, aligned by index — e.g. [{ State: 'default' }, { State: 'hover' }]. Each component is renamed to 'Prop=Value, ...' before combining. Without this, existing names are kept (names lacking '=' become 'Property 1=<name>').

Create a new blank slide in the Figma Slides presentation. Optionally specify grid position.

Column index in the slide grid (0-based)

Row index in the slide grid (0-based)

Create a SlotNode inside a component using createSlot(). Automatically creates a linked SLOT component property named after the slot (renaming the slot renames the property). Slots are freeform drop zones for instance content — more flexible than INSTANCE_SWAP. Works on standalone COMPONENTs and variant COMPONENTs inside a COMPONENT_SET (call once per variant). GRID layout is not allowed on slots. Requires Desktop Bridge.

Initial slot height in pixels

Auto-layout mode for the slot (GRID is not supported)

Slot layer name (e.g. 'Content', 'Footer')

The COMPONENT node ID to add a slot to

Initial slot width in pixels

Create a single Figma variable. For multiple variables, use figma_batch_create_variables instead (10-50x faster). Use figma_get_variables first to get collection IDs. Supports COLOR, FLOAT, STRING, BOOLEAN. Requires Desktop Bridge plugin.

The collection ID to create the variable in (e.g., 'VariableCollectionId:123:456'). Get this from figma_get_variables.

Optional description for the variable

Name for the new variable (e.g., 'primary-blue')

The variable type: COLOR, FLOAT, STRING, or BOOLEAN

Optional initial values by mode ID. Example: { '1:0': '#FF0000', '1:1': '#0000FF' }

Create an empty variable collection. To create a collection WITH variables and modes in one step, use figma_setup_design_tokens instead. Requires Desktop Bridge plugin.

Additional mode names to create. Example: ['Dark', 'High Contrast']

Name for the initial mode (default mode is created automatically). Example: 'Light'

Name for the new collection (e.g., 'Brand Colors')

Delete a comment from a Figma file by its comment ID. Use figma_get_comments to find comment IDs first.

The ID of the comment to delete. Get IDs from figma_get_comments.

Figma file URL. Uses current URL if omitted.

Delete a component property. Works with BOOLEAN, TEXT, INSTANCE_SWAP, and SLOT properties (not VARIANT). This is a destructive operation.

The component or component set node ID

The full property name with suffix (e.g., 'Show Icon#123:456')

Delete a node from the canvas. WARNING: This is a destructive operation (can be undone with Figma's undo).

The node ID to delete

Delete a slide from the presentation. WARNING: This is a destructive operation (can be undone with Figma's undo).

The node ID of the slide to delete

Delete a Figma variable. WARNING: This is a destructive operation that cannot be undone (except with Figma's undo). Use figma_get_variables first to get variable IDs. Requires the Desktop Bridge plugin to be running.

The variable ID to delete (e.g., 'VariableID:123:456'). Get this from figma_get_variables.

Delete a Figma variable collection and ALL its variables. WARNING: This is a destructive operation that deletes all variables in the collection and cannot be undone (except with Figma's undo). Requires the Desktop Bridge plugin to be running.

The collection ID to delete (e.g., 'VariableCollectionId:123:456'). Get this from figma_get_variables.

Designer-readable health check for figma-console-mcp. Use this when something seems wrong — it self-identifies the server, reports plugin connection / file / token status in plain language, and disambiguates errors that may be coming from a different Figma-related MCP server. Recommended as the first step when a user reports a "token expired" or "plugin disconnected" issue.

Include the raw structured state alongside the human-readable report.

Diff two versions of a Figma file. Always returns a cheap page-structure diff (added/removed/renamed pages, 2 API calls). Pass component_ids to additionally get per-node deep diffs at depth=2 (added/removed children, name/description changes, componentPropertyDefinitions changes for COMPONENT_SETs, boundVariables deltas) — costs 2 API calls per scoped node. Use 'current' for to_version to diff against HEAD. v1.25.0: when the Desktop Bridge plugin is connected, description and Dev Mode annotation changes are ALSO tracked via a session buffer and surfaced under `scoped_nodes[].metadata_changes[]` and `unscoped_metadata_changes[]` — Figma REST omits these from version snapshots so they're otherwise invisible. STILL NOT tracked: instances of components on the canvas, raw layout properties (layoutSizingHorizontal/Vertical, unbound paddings/widths), raw visual properties (cornerRadius, unbound fills), variable VALUE changes, style content, and metadata edits made while the plugin was disconnected. See `scope_coverage` and `notes[]` for the full coverage map and complementary tools.

Optional. Node IDs (typically COMPONENT_SETs) to diff in detail. If omitted, falls back to the current Figma selection. If neither is available, only the page-structure diff is returned. Use figma_get_design_system_kit or figma_search_components to discover IDs explicitly.

The earlier version_id to compare from. Get from figma_get_file_versions.

Output verbosity. summary=counts only, standard=names+counts (default), detailed=full property/binding details.

The later version_id to compare to. Use 'current' for HEAD.

Analyze one or more production app codebases as the first step of design system extraction. Detects framework (React/Next/Angular/Web Components), styling methods (Tailwind v3/v4, CSS Modules, SCSS, Emotion, styled-components), and vendor component layers (shadcn/ui, Radix, MUI, Chakra, etc.); builds a component inventory with per-component classification (vendored / wrapped / pure-vendor / bespoke), prop contracts, real usage counts (porting rank), observed prop values (variant inference), and duplicate detection. Pass multiple targets to find the shared design language across several apps. Writes the full manifest to <outDir>/.extraction/analysis.json and returns a compressed summary — read slices of the manifest for detail. Run this before figma_ds_extract_tokens and figma_ds_scaffold. Local Mode only.

Substring filters on relative paths to skip (node_modules, dist, .next etc. are always skipped).

Substring filters on relative paths — when set, only matching files are scanned (e.g. ['src/', 'app/']).

Hard cap on files scanned per target (default 5000).

Directory where the design-system package will be generated (manifests persist under <outDir>/.extraction/). Default: '<first target>/design-system'.

App root directories to analyze. Absolute paths strongly recommended (the MCP server's working directory is not the project). Multiple targets = cross-app extraction: the inventory merges and duplicate components across apps are flagged.

Deep-extract ONE component from the inventory for porting into the design system: returns its source (capped), local import closure (relative imports to follow), prop contract, observed call-site variants, vendor classification, style touchpoints (classNames, CSS-module imports, custom properties referenced), and a ready-to-adapt CSF3 story scaffold with variant stories inferred from real usage. The agent then ports the component into <outDir>/src/components/<Name>/ and records progress with figma_ds_status. Local Mode only.

Component name from the inventory (see figma_ds_analyze topByUsage, or the analysis manifest for the full list).

The outDir used in figma_ds_analyze (manifest is read from it).

Extract design tokens from analyzed codebases into canonical DTCG JSON (plus optional CSS variables / Tailwind / SCSS / TypeScript projections). Mines declared styling intent first — :root and @theme custom properties (light+dark → multi-mode tokens), SCSS variables, tailwind.config theme values, shadcn HSL triples — then promotes recurring raw values (hex colors, spacing/radius/font sizes) above a frequency threshold. Every token carries provenance (source file:line, confidence, frequency) in $extensions. Names are structural as-mined; do a semantic-naming review pass with the user afterwards. The DTCG output is directly importable into Figma variables with figma_import_tokens (top-level groups become collections). Requires figma_ds_analyze to have run for the same outDir. Local Mode only.

DTCG dialect: 'legacy' hex-string colors (max compatibility) or '2025' DTCG 2025.10 object colors/dimensions.

Token file formats to write under <outDir>/tokens/. 'dtcg' (canonical) is always written. Match the app's styling method — e.g. add 'tailwind-v4' for a Tailwind app, 'scss' for SCSS.

dtcg css-vars tailwind-v4 tailwind-v3 scss ts-module json-nested json-flat tokens-studio style-dictionary-v3

How often a raw (undeclared) value must recur to be promoted to a token (default 4). Values below the threshold are listed in the report for review.

The outDir used in figma_ds_analyze (reads .extraction/analysis.json from it). Default: '<first target of the analysis run>/design-system' — pass explicitly when in doubt.

Override: scan these app roots instead of the analysis manifest's targets (rarely needed).

Write token files to <outDir>/tokens/ (default true). False returns the DTCG document inline instead (dry run).

Generate the design-system package skeleton at outDir from a completed analysis + token extraction: package.json (app framework as peer deps), src/components layout, token files via the shared formatter engine, a framework-neutral token-showcase MDX docs page (the bird's-eye view), and a README with the workflow. Storybook itself is NOT installed by this tool — after scaffolding, run `npm create storybook@latest` inside outDir (the CLI auto-detects the framework and installs the current Storybook version). Additive by default: existing files are skipped unless force. Local Mode only.

DTCG dialect for dtcg/json outputs.

Overwrite existing scaffold files (token files always refresh).

Token formats to (re)generate under tokens/.

Override the scaffold framework. Default: the first framework detected by figma_ds_analyze. Note: Storybook has no .astro renderer — 'astro' scaffolds a react-vite workshop whose stories mirror the component markup.

react next astro angular web-components vue svelte

The outDir used in figma_ds_analyze / figma_ds_extract_tokens.

npm package name for the design system (e.g. '@acme/design-system'). Default: '@extracted/design-system'.

Wire a freshly-initialized Storybook workshop to the extracted design system — run AFTER `npm create storybook@latest` inside outDir. Generates .storybook/preview.css (Tailwind entry importing the extracted tokens plus the SOURCE app's @theme utility mapping, custom @utility definitions, @layer base, and @font-face rules mined from its stylesheets, with a dark variant covering both .dark and [data-theme] conventions), copies self-hosted font files into staticDirs, and patches main.js (tailwind vite plugin + automatic JSX runtime — without it stories throw 'React is not defined') and preview.jsx (preview.css import + a theme toolbar/decorator using the extracted mode names). Idempotent; anything it can't patch safely is returned as a manual step. Local Mode only.

The design-system package dir (same outDir as figma_ds_analyze) containing the freshly-initialized .storybook/.

Read or update design-system extraction porting progress (persisted in <outDir>/.extraction/status.json so long engagements survive session boundaries). Call with only outDir to get a progress summary; pass update to record a component's porting status. Local Mode only.

The outDir used in figma_ds_analyze.

Status update to record. Omit to just read progress.

Component name from the inventory.

Why skipped / consolidation decisions / gotchas.

New porting status.

Relative path of the story file, once written.

Run the deterministic fidelity evals on an extracted design system package — the governance gate before handing off or pushing to Figma. Checks: tokens.json parses as DTCG and every alias resolves (import-ready); no quoted CSS functional expressions in generated token files (kills transitions); every var() consumed in component/preview CSS resolves in the workshop; every component directory has a stories file and index barrel; every portable inventory component has a porting status. Each check encodes a failure class found in real extraction runs. Also reports Figma round-trip readiness with the exact figma_import_tokens call for design-led orgs (ask the user code-led vs design-led). Local Mode only.

The design-system package dir (same outDir as figma_ds_analyze).

Duplicate an existing slide. The clone is placed adjacent to the original.

The node ID of the slide to duplicate

Edit an existing component property. Can change the name, default value, or preferred values (for INSTANCE_SWAP). Use the full property name including the unique suffix.

Object with the values to update

New default value

New name for the property

Preferred values (INSTANCE_SWAP only)

Component or component set key

Type of preferred value

The component or component set node ID

The full property name with suffix (e.g., 'Show Icon#123:456')

Execute arbitrary JavaScript in Figma's plugin context with full access to the figma API. Use for complex operations not covered by other tools. Requires Desktop Bridge plugin. CAUTION: Can modify your document.

**COMPONENT INSTANCES:** For instances (node.type === 'INSTANCE'), use figma_set_instance_properties — direct text editing FAILS SILENTLY. Check instance.componentProperties for available props (may have #nodeId suffixes).

**RESULT ANALYSIS:** Check resultAnalysis.warning for silent failures (empty arrays, null returns).

**VALIDATION:** After creating/modifying visuals: screenshot with figma_capture_screenshot, check alignment/spacing/proportions, iterate up to 3x.

**PLACEMENT:** Always create components inside a Section or Frame, never on blank canvas. Use parent.insertChild(0, bg) for z-ordering backgrounds behind content.

**HOUSEKEEPING (MANDATORY):**
Before creating: screenshot the target page to see existing content and find clear space.
When creating: place inside a named Section, positioned BELOW or AWAY from existing content. Never overlap.
After creating: screenshot to verify clean placement and no overlaps.
On failure/retry: DELETE any partial artifacts (empty frames, orphaned layers, blank pages) before retrying. Use node.remove() to clean up.
Pages: NEVER create a new page if one with that name already exists — use the existing one. If you created a blank page during a failed attempt, delete it.
Layers: If your code creates helper frames, placeholder nodes, or intermediate layers that aren't part of the final result, remove them.

**MULTI-FILE (Local Mode only):** Pass fileKey to run this in a specific connected file without switching the active file/target lock (see figma_list_open_files). To run the same code across several connected files at once, use figma_execute_across_files instead. Cloud Mode pairs with a single plugin instance and rejects fileKey.

JavaScript code to execute. Has access to the 'figma' global object. Example: 'const rect = figma.createRectangle(); rect.resize(100, 100); return { id: rect.id };'

Local Mode only. Run against this specific connected file instead of the active file. Does not change the active file or target lock. Get connected fileKeys from figma_list_open_files. Rejected in Cloud Mode, which pairs with a single plugin instance.

Execution timeout in milliseconds (default: 5000, max: 30000)

Run the same JavaScript against multiple Figma files connected via the Desktop Bridge plugin, IN PARALLEL, without touching the active file or target lock. Built for cross-file consistency work — e.g. running the same structural check or fix against every file in a multi-file design system and diffing the results — instead of switching the active file and running figma_execute once per file in sequence. Each file's code runs in that file's own plugin context (same 'figma' global as figma_execute). You must say which files to target: pass fileKeys (read them from figma_list_open_files first — strongly preferred for anything that writes), or pass allFiles: true to hit every connected file. Requires Desktop Bridge plugin open in each target file. Local Mode only.

Run against EVERY currently connected file. Opt-in on purpose: this executes the code in files the user may be actively working in, including any file pinned by target lock. Prefer naming fileKeys explicitly for anything that writes.

JavaScript code to execute in each targeted file. Has access to the 'figma' global object, same as figma_execute. Example: 'return { pageCount: figma.root.children.length };'

Which connected files to target, by fileKey. Get fileKeys from figma_list_open_files. Required unless allFiles is true.

Per-file execution timeout in milliseconds (default: 10000, max: 30000). Applies independently to each file — one slow/unresponsive file does not delay the others.

Export Figma variables to design token files in your codebase. Bidirectional with figma_import_tokens — together they replace Style Dictionary and Tokens Studio's export pipeline for the popular styling methods.

FULLY-IMPLEMENTED OUTPUT FORMATS:
  • dtcg — W3C DTCG JSON. Canonical pivot format. Round-trip safe via `$extensions["figma-console-mcp"]`.
  • css-vars — CSS custom properties with mode-aware selectors (`:root`, `.dark`, `[data-theme=...]`).
  • tailwind-v4 — Tailwind v4 `@theme inline` block. Token-to-namespace mapping (color/*, spacing/*, radius/*, etc.) generates Tailwind utility classes.
  • tailwind-v3 — `tailwind.config.js` theme.extend object grouped under Tailwind's theme keys (colors, spacing, fontFamily, etc.).
  • scss — `$var: value;` declarations. Multi-mode emits a primary variable + a mode-keyed SCSS map for runtime access.
  • ts-module — `export const tokens = { ... } as const` with derived `Tokens` type. Multi-mode tokens emit as `{ Light: ..., Dark: ... }` objects.
  • json-flat — flat key-value JSON (`{"ds-color-primary": "#4085F2"}`) for custom build scripts.
  • json-nested — nested object JSON mirroring the token path tree.
  • style-dictionary-v3 — SD v3 source format with bare `value`/`type` keys (back-compat for existing SD users).
  • tokens-studio — Tokens Studio multi-file layout (`$themes.json` + `$metadata.json` + per-set files). Preserves Figma collection/mode bindings for round-trip with the TS plugin.

ZERO-ARG USAGE: With a tokens.config.json at your project root, just call the tool with no args — it picks up source dir, output formats, modes, prefix, etc. from config. See the response's `suggestedScaffold` payload when no config is detected — present it to the user, write the scaffold via your file tools, then call again.

MERGE STRATEGY: Default `strategy: "merge"` only writes tokens that actually changed in Figma since the last sync. Use `dry-run` to preview what would change. Use `replace` to wipe and rewrite (rare; for resetting drift).

DTCG DIALECT (`dtcgDialect`, applies to dtcg/json-flat/json-nested outputs): legacy (default): hex-string colors, maximum compatibility (Style Dictionary v4, Tokens Studio). 2025: DTCG 2025.10 object colors/dimensions (Style Dictionary v5+). figma_import_tokens accepts BOTH dialects regardless of this setting.

ROUND-TRIP SAFETY: Figma variable IDs are preserved in DTCG `$extensions["figma-console-mcp"]` so renames on either side don't create duplicates. The same metadata enables non-destructive incremental sync via figma_import_tokens. Variable scopes (when non-default) and per-platform codeSyntax (when set) are stashed there too and round-trip through import.

Specific Figma collection IDs to export. Required when scope is 'collection'. Use figma_get_variables to enumerate available collections.

Color value format in the output. Default: 'hex'. Use 'oklch' for modern Tailwind v4 charts.

Explicit path to a tokens.config.json file. When omitted, the tool walks up from cwd looking for one — typical case is zero-arg.

DTCG dialect for dtcg/json-flat/json-nested outputs. legacy (default): hex-string colors, maximum compatibility (Style Dictionary v4, Tokens Studio). 2025: DTCG 2025.10 object colors/dimensions (Style Dictionary v5+). Other formats (css-vars, scss, tailwind, ts-module) render final code and ignore this option.

Specific output format to emit. When omitted, formats come from tokens.config.json's generated.formats list. Common starting choices: 'dtcg' for the canonical JSON, 'css-vars' for runtime CSS custom properties, 'tailwind-v4' for Tailwind v4 @theme blocks.

dtcg tokens-studio css-vars tailwind-v4 tailwind-v3 scss less ts-module json-flat json-nested style-dictionary-v3

Modes to include in the output. 'all' (default) exports every mode in every collection. Pass an array like ['Light', 'Dark'] to filter.

Filesystem path to write the output file(s) to. Relative paths resolve against the project root (the directory containing tokens.config.json) or cwd if no config. When omitted, the output is returned inline in the response (suitable for the AI to inspect or write via its own file tools).

Prefix prepended to every output token name (e.g. 'ds-', 'al-'). Only affects formatters that emit named tokens — DTCG and JSON outputs use unmodified paths.

Base font size in pixels for px→rem conversion. Default: 16.

If true, alias references are resolved to literal values in the output. Default is false for JSON formats (preserves alias semantics) and true for CSS/SCSS/Tailwind/etc. (which can't natively express aliases).

Whether to export the entire file's variables ('file', default) or just specific collections via collectionIds.

Unit for dimension tokens. Default: 'rem' for web outputs, 'pt' for iOS, 'dp' for Android.

Emit one file per Figma collection. Default false. Useful when collections map to different runtime themes.

Emit one file per mode (e.g. tokens-light.css, tokens-dark.css). Default false (single file with all modes).

How to handle existing output files. 'merge' (default) diffs against current contents and writes only changed tokens, preserving code-only additions. 'replace' wipes and rewrites. 'dry-run' computes the diff and reports what would change without writing.

Navigate to and focus a specific slide in single-slide view.

The node ID of the slide to focus

Generate a human-readable markdown changelog between two versions. Wraps figma_diff_versions and enriches the output with author labels and timestamps via figma_get_file_versions lookback (one extra cheap API call). Returns BOTH a `markdown` string (paste into release notes / PRs / Storybook MDX) and the structured diff data. Same component_ids and mode semantics as figma_diff_versions. Use 'current' for to_version to changelog against HEAD.

Optional. Node IDs to include in the per-component changelog section. If omitted, falls back to the current Figma selection.

Figma file URL. Uses current URL if omitted.

The earlier version_id. Get from figma_get_file_versions.

Output verbosity. summary=one-liner, standard=sectioned with counts (default), detailed=full per-property/per-binding bullets.

The later version_id. Use 'current' for HEAD.

Generate AI-complete component documentation from a Figma component. Produces structured markdown with anatomy, per-variant color tokens, typography, content guidelines (parsed from Figma description), design annotations (animation timings, interaction specs, accessibility notes from Dev Mode), icon mapping, spacing tokens, and design-code parity analysis. Merges Figma design data with optional code-side info (CVA definitions, sub-component APIs, source files). Output works with any docs platform. For richest output, read the component source code first and pass codeInfo. Pass history: { figma: true, git: true } to add an ongoing '## History' section: per-version design changes pulled from Figma version history and scoped to this component, plus recent git commits touching its source files.

Code-side documentation info. Read the component source code first, then fill in relevant sections. Include variantDefinition for CVA/variant code, subComponents for composable sub-parts, sourceFiles for all related files, and baseComponent for attribution.

Base component this extends (e.g., shadcn/ui Alert)

Changelog entries

Events emitted by the component

Component file path

Import statement for the component

Package name

Component props

Named slots

All source files related to this component

Sub-components that compose this component (e.g., AlertTitle, AlertDescription)

data-slot attribute value

HTML element rendered (e.g., 'div', 'span')

Usage examples

CVA or variant definition code block

Enable enrichment for token data

Pull an ongoing changelog from Figma version history and/or git. When enabled, replaces the manual '## Changelog' section with a richer '## History' section. Both sources are off by default so existing callers are unaffected.

Pull design history from Figma version history, scoped to this component. Costs roughly one API call per version walked.

Pull code history via `git log` for the component's source files. Local mode only.

How many commits to list. Default 10, max 50.

Explicit paths to log commits for. Defaults to codeInfo.filePath plus codeInfo.sourceFiles[].path.

Include unlabeled Figma auto-saves. Default false — autosaves are noisy and often unattributed.

Design-history verbosity. detailed names individual properties and variable bindings.

Repo directory to run git in. Defaults to the server's working directory.

How many Figma versions to walk back. Default 5, max 20.

Include YAML frontmatter metadata

Component node ID (e.g., '695:313')

Suggested output file path

Toggle which sections to include

Design system name for headers

List available annotation categories in the current Figma file. Categories group annotations by purpose (e.g., interactions, accessibility, development notes). Use the returned category IDs when creating annotations with figma_set_annotations. Requires Desktop Bridge plugin.

Read annotations from a Figma node. Annotations are designer-authored specs attached to nodes — they can include notes (plain text or markdown), pinned design properties (fills, width, fontSize, etc.), and category labels. Use this to discover animation timings, interaction specs, accessibility requirements, and other implementation details that designers annotate directly on the design. Set include_children=true to get annotations from child nodes too (useful for full component documentation). Requires Desktop Bridge plugin.

How many levels deep to traverse when include_children is true (default: 1, max recommended: 5)

Also read annotations from child nodes. Useful for getting all annotations within a component tree.

Node ID to read annotations from (e.g., '695:313')

Convenience wrapper for figma_diff_versions: compares a given version against the current HEAD. Same output shape as figma_diff_versions, with to_version implicitly 'current'. Useful for 'what's changed since the last code-sync' workflows.

Optional. Node IDs to diff in detail. If omitted, falls back to the current Figma selection. Same semantics as figma_diff_versions otherwise.

Figma file URL. Uses current URL if omitted.

The version_id to compare against the current HEAD.

Get comments on a Figma file. Returns comment threads with author, message, timestamps, and pinned node locations. Use include_resolved to also see resolved comments.

Return comment message bodies as markdown. Default: false

Include resolved (completed) comment threads. Default: false (only active comments)

Get a SINGLE component's metadata or reconstruction specification. Two export formats: (1) 'metadata' (default) - comprehensive documentation with properties, variants, and design tokens for style guides and references, (2) 'reconstruction' - node tree specification compatible with Figma Component Reconstructor plugin for programmatic component creation. IMPORTANT: For local/unpublished components with metadata format, ensure the Figma Desktop Bridge plugin is running (Right-click in Figma → Plugins → Development → Figma Desktop Bridge) to get complete description data. TIP: To get ALL components with visual specs in one call, prefer figma_get_design_system_kit instead.

Set to true when user asks for: design token coverage, hardcoded value analysis, or component quality metrics. Adds token coverage analysis and hardcoded value detection. Default: false. Only applicable for metadata format.

Figma file URL (e.g., https://figma.com/design/abc123). Auto-detected from WebSocket Desktop Bridge connection. Only required if not connected.

Export format: 'metadata' (default) for comprehensive documentation, 'reconstruction' for node tree specification compatible with Figma Component Reconstructor plugin

Component node ID (e.g., '123:456')

Get full details for a specific component including all variants, properties, and keys needed for instantiation. Use the component key or name from figma_search_components.

The component key (preferred for exact match)

The component name (used if key not provided)

Get component data optimized for high-fidelity UI implementation. Returns a deep component tree (depth 4) with design tokens (boundVariables), interaction states (reactions), sizing constraints (min/max/layoutSizing), text behavior (autoResize, truncation), Figma slots (named freeform-content regions on a component, with the components each accepts and any min/max limit violations), and design annotations. Automatically includes 2x rendered image. Use when user asks to: 'build this component', 'implement this in React/Vue', 'generate code for', or needs both visual reference and technical specs for production-quality, accessible, token-aware code. For just metadata/descriptions, use figma_get_component. For just image, use figma_get_component_image. For full annotation details, use figma_get_annotations. To resolve variable IDs to names/values, use figma_get_variables.

Path to target codebase components directory (e.g., '/Users/me/project/src/components'). When provided, scans for existing components and includes a registry in the response to prevent recreating components that already exist. Strongly recommended for design-to-code workflows.

Figma file URL (e.g., https://figma.com/design/abc123). REQUIRED unless figma_navigate was already called.

Include rendered image for visual reference (default: true)

Component node ID to get data for (e.g., '695:313')

Get a deeply nested component tree with full visual properties, resolved design token names, instance references, prototype interactions, and annotations at every level. Uses the Desktop Bridge Plugin API for unlimited depth traversal — essential for complex components like data tables, nested menus, date pickers, and compound form fields where the standard depth-4 REST API tool misses deeper structure. Returns boundVariables resolved to actual token names (not just IDs), mainComponent references for INSTANCE nodes, and reactions for interaction states. Requires Desktop Bridge plugin. For simpler components (depth ≤ 4), use figma_get_component_for_development instead.

Maximum tree depth to traverse (default: 10, max: 20). Use higher values for deeply nested components.

Component node ID to extract (e.g., '695:313')

Render a specific component or node as an image (PNG, JPG, SVG, PDF). Returns image URL valid for 30 days. Use when user asks for: component screenshot, visual preview, rendered output, or 'show me'. NOT for component metadata/properties (use figma_get_component). NOT for getting code/layout data (use figma_get_component_for_development). Best for: visual references, design review, documentation.

Image format (default: png)

Component node ID to render as image (e.g., '695:313')

Image scale factor (0.01-4, default: 2 for high quality)

Retrieve console logs from Figma Desktop. FOR PLUGIN DEVELOPERS: This works immediately - no navigation needed! Just check logs, run your plugin in Figma Desktop, check logs again. All plugin logs ([Main], [Swapper], etc.) appear instantly.

Number of recent logs to retrieve

Filter by log level

Only logs after this timestamp (Unix ms)

Get recent document changes detected in Figma. Returns buffered change events including which nodes changed, whether styles were modified, and change counts. WebSocket-only — events are captured via Desktop Bridge plugin. Use this to understand what changed since you last checked.

Clear the change buffer after reading. Set to true for polling workflows.

Maximum number of change events to return (chronological order, oldest to newest; returns the last N events)

Only return changes after this Unix timestamp (ms). Useful for incremental polling.

PREFERRED TOOL for design system extraction — replaces separate figma_get_styles, figma_get_variables, and figma_get_component calls. Returns tokens, components, and styles in a single optimized response with adaptive compression for large systems. Includes component visual specs (exact colors, padding, typography, layout), rendered screenshots, token values per mode (light/dark), and resolved style values. Use this instead of calling individual tools to avoid context window overflow. Ideal for AI code generation — use visualSpec for pixel-accurate reproduction. Variant specs are delta-encoded: the base variant carries the full visualSpec, siblings carry visualSpecDelta with only the properties that differ. Tokens/variables are read through the connected Desktop Bridge or cloud relay and work on ANY Figma plan — no Enterprise required. If a tokens fetch ever reports the Variables REST API is plan-limited (403), the bridge/relay is the plan-independent path: ensure it's connected and retry rather than abandoning variables.

Optional list of specific component node IDs to include. If omitted, all published components are returned.

Figma file key. If omitted, extracted from the current browser URL.

'full' returns complete data with visual specs and resolved values. 'summary' strips variant-level visual specs (medium payload). 'compact' returns only names, types, and property definitions (smallest payload, best for large design systems). Auto-compresses if response exceeds safe size regardless of format setting.

Which sections to include. Defaults to all.

Include image URLs for components (adds latency). Default false.

Get a compact overview of the design system. Returns categories, component counts, and token collection names WITHOUT full details. Use this first to understand what's available, then use figma_search_components to find specific components. This tool is optimized for minimal token usage.

Force refresh the cached data (use sparingly - extraction can take minutes for large files)

Fetch a Figma file (or specific nodes) as it existed at a past version_id. Thin snapshot tool — same shape as figma_get_file_data but bound to a historical version. Use figma_get_file_versions to discover version IDs. Combine with depth and node_ids to keep payloads small. Required scope: file_content:read (already standard).

How deep into the document tree to recurse. Lower is cheaper. Default: full depth (no limit).

Figma file URL. Uses current URL if omitted.

Optional: snapshot only these node IDs instead of the full file. Reduces payload significantly for targeted inspection.

The version ID to snapshot (from figma_get_file_versions).

Get full file structure and document tree. WARNING: Can consume large amounts of tokens. NOT recommended for component descriptions (use figma_get_component instead). Best for understanding file structure or finding component nodeIds. Start with verbosity='summary' and depth=1 for initial exploration.

How many levels of children to include (default: 1, max: 3). Start with 1 to prevent context exhaustion. Use 0 for full tree only when absolutely necessary.

Set to true when user asks for: file statistics, health metrics, design system audit, or quality analysis. Adds statistics, health scores, and audit summaries. Default: false

Figma file URL (e.g., https://figma.com/design/abc123). Auto-detected from WebSocket Desktop Bridge connection. Only required if not connected.

Specific node IDs to retrieve (optional)

Controls payload size: 'summary' (IDs/names/types only, ~90% smaller - RECOMMENDED), 'standard' (essential properties, ~50% smaller), 'full' (everything). Default: summary for token efficiency.

Get file data optimized for plugin development with filtered properties (IDs, structure, plugin data, component relationships). Excludes visual properties (fills, strokes, effects) to reduce payload. Use when user asks for: plugin development, file structure for manipulation, node IDs for plugin API. NOT for component descriptions (use figma_get_component). NOT for visual/styling data (use figma_get_component_for_development). Supports deeper tree traversal (max depth=5) than figma_get_file_data.

How many levels of children to include (default: 2, max: 5). Higher depths are safe here due to filtering.

Figma file URL (e.g., https://figma.com/design/abc123). REQUIRED unless figma_navigate was already called.

List a Figma file's version history with metadata (label, description, author, timestamp). Auto-paginates up to max_versions. By default returns only labeled versions (skips auto-saves). Pass include_autosaves=true to see every saved state. Use the returned pagination.next_cursor to continue paging. Required scope: file_versions:read (OAuth) or 'Versions' Read (PAT).

Version ID returned as pagination.next_cursor on a previous call. Pass to continue from where the last call stopped.

Include auto-saved versions (those without a label). Default: false.

Hard cap on returned versions. Default 50, max 200.

Get the slide currently focused in single-slide view.

Get full property definitions, variants, and visual specs for a SINGLE published library component using only its component key.

**USE THIS when you have a component key** (the 40-char hex returned by figma_search_components, figma_get_library_components, or search_design_system) **and want to inspect what properties/variants it exposes** before instantiating it — without first needing the source library file's URL.

**RESOLVES**: componentKey → file_key + node_id → componentPropertyDefinitions + variants + visualSpec.

**WORKFLOW**:
1. Pass the componentKey from search results
2. Tool tries /v1/component_sets/{key} first (most common case — buttons, inputs with variants)
3. On 404 falls back to /v1/components/{key} (standalone components)
4. Fetches the parent COMPONENT_SET at depth=2 to read componentPropertyDefinitions and per-variant visual data
5. For COMPONENT_SET keys, also fetches the source file's /components list to map each variant's node to its published variant key (needed for figma_instantiate_component)

**REQUIRES** FIGMA_ACCESS_TOKEN with library_assets:read and files:read scopes.

The component key (40-char hex string from search results, e.g., '806826503bbd2ab15d0ff77d076a9406a5a83197'). Works for both COMPONENT_SET and standalone COMPONENT keys.

'full' returns properties + variants + visual specs. 'summary' returns properties + variant names only (no visualSpec). Auto-downgrades to 'summary' on large responses.

Include per-variant visual specs (fills, strokes, padding, typography). Default true. Auto-stripped if response exceeds 500KB.

Discover published components from a shared/team library file.

**USE THIS when you need to use components from a published design system library** (a different file than the one currently open). This bridges the gap between library discovery and instantiation.

**WORKFLOW:**
1. Call this tool with the library file's URL or file key
2. Browse the returned components — results include COMPONENT_SET (with variants array) and standalone COMPONENT types
3. Use figma_instantiate_component with a VARIANT key (from the variants array inside a COMPONENT_SET result, NOT the component set key itself)

**SEARCH NOTE:** The query filter matches both component names AND descriptions. If you get unexpected results (e.g., "Accordion" when searching "Button"), verify the result name matches what you need — it may have matched on a description mention.

**MULTI-FILE TIP:** If you need to find a specific component and REST API search returns too many results, you can switch to the library file via figma_navigate, use figma_execute to find the exact component and its variant key, then switch back.

**NOTE:** Requires FIGMA_ACCESS_TOKEN to be set (uses the Figma REST API to read the library file).

Include individual variant components (default: false, only returns component sets)

The file key of the library file (e.g., 'abc123'). Either this or libraryFileUrl is required.

The URL of the library file (e.g., https://www.figma.com/design/abc123/My-Design-System). Either this or libraryFileKey is required.

Maximum results to return (default: 25, max: 100)

Offset for pagination

Search query to filter components by name (e.g., 'Button', 'Card'). Leave empty to get all components.

List all variables from team libraries the current file has subscribed.

**USE THIS** when you want to see what design tokens (colors, spacing, typography sizes, booleans, strings) are available from shared libraries — without needing the library file's URL or REST API Enterprise plan.

**HOW IT WORKS**: Calls figma.teamLibrary.getAvailableLibraryVariableCollectionsAsync() + getVariablesInLibraryCollectionAsync() via the Desktop Bridge. Only libraries the user has explicitly enabled in the current file appear (Figma security model).

**WORKFLOW**:
1. Call this tool to inventory available library variables
2. Find the variable you want (use libraryName + collectionName + variable name to identify)
3. Pass its key to figma_import_library_variable to bring it into the current file
4. Once imported, the variable's id can be used with figma_set_fills / figma_update_variable / any standard variable-binding tool

**Filters**: libraryName/collectionName accept partial case-insensitive matches.

**REQUIRES** the Desktop Bridge plugin to be running in Figma Desktop.

Optional: filter by collection name within a library (case-insensitive substring match). E.g., 'Colors' or 'Spacing'.

Optional: filter by library name (case-insensitive substring match). E.g., 'Northright' or 'Altitude'.

Optional: filter by variable type. Useful when you only need color tokens or only spacing values.

Get the currently selected nodes in Figma. Returns node IDs, names, types, and dimensions. WebSocket-only — requires Desktop Bridge plugin. Use this to understand what the user is pointing at instead of asking them to describe it.

If true, fetches additional details (fills, strokes, styles) for each selected node via figma_execute

Get the content tree of a specific slide including all text, shapes, and frames. Returns node hierarchy with properties.

The node ID of the slide, e.g. '1:23'

Get the 2D slide grid layout showing how slides are organized in rows and columns.

Get the current transition settings for a slide (style, duration, easing curve, timing).

The node ID of the slide

List SlotNode children on a component, component set, or instance. Returns slot IDs, names, property keys, dimensions, and current child nodes. Use on instances before figma_append_to_slot to discover slot names/IDs.

COMPONENT, COMPONENT_SET, or INSTANCE node ID

Check connection status to Figma Desktop. Reports transport status and connection health via the Desktop Bridge plugin (WebSocket transport). Use probe:true for an active roundtrip verification that the plugin is actually responding.

When true, sends a live roundtrip command to the plugin to verify the connection is actually responsive (not just TCP-open). Returns probeResult with success/latency. Recommended for health checks.

Get all styles (color, text, effects, grids) from a Figma file with optional code exports. Use when user asks for: text styles, color palette, design system styles, typography, or style documentation. Returns organized style definitions with resolved values. NOT for design tokens/variables (use figma_get_variables). Set enrich=true for CSS/Tailwind/Sass code examples. Supports verbosity control to manage payload size. TIP: For full design system extraction (tokens + components + styles combined), prefer figma_get_design_system_kit instead — it returns everything in one optimized call.

Set to true when user asks for: CSS/Sass/Tailwind code, export formats, usage information, code examples, or design system exports. Adds resolved values, usage analysis, and export format examples. Default: false for backward compatibility

Which code formats to generate examples for. Use when user mentions specific formats like 'CSS', 'Tailwind', 'SCSS', 'TypeScript', etc. Automatically enables enrichment. Default: all formats

Figma file URL (e.g., https://figma.com/design/abc123). Auto-detected from WebSocket Desktop Bridge connection. Only required if not connected.

Include export format examples (requires enrich=true)

Include component usage information (requires enrich=true)

Controls payload size: 'summary' (names/types only, ~85% smaller), 'standard' (essential properties, ~40% smaller), 'full' (everything). Default: standard

Get all local text styles in the current file. Returns style IDs, names, font info, and sizes. Use these IDs when setting textStyleId on text nodes via figma_execute.

Get actual values for design tokens (colors, spacing, etc). Use after figma_get_design_system_summary to get specific token values for implementation.

Filter token names (e.g., 'primary' to get all primary colors)

Maximum tokens to return (default: 50)

Type of tokens to retrieve

Extract design tokens and variables from a Figma file with code export support (CSS, Tailwind, TypeScript, Sass). Use when user asks for: design system tokens, variables, color/spacing values, theme data, or code exports. Handles multi-mode variables (Light/Dark themes). NOT for component metadata (use figma_get_component). Returns a compact summary by default — pass format='full' for the complete dataset or format='filtered' with collection/namePattern/mode filters for specific variables. Supports verbosity control to prevent token exhaustion. Resolution order: Desktop Bridge plugin (works on any plan) → Variables REST API (Enterprise only) → Styles API as a partial fallback. TIP: For full design system extraction (tokens + components + styles combined), prefer figma_get_design_system_kit instead — it returns everything in one optimized call.

Filter variables by collection name or ID. Case-insensitive substring match. Only applies when format='filtered'. Example: 'Primitives' or 'VariableCollectionId:123'

Set to true when user asks for: CSS/Sass/Tailwind exports, code examples, design tokens, usage information, dependencies, or any export format. Adds resolved values, dependency graphs, and usage analysis. Default: false

Which code formats to generate examples for. Use when user mentions specific formats like 'CSS', 'Tailwind', 'SCSS', 'TypeScript', etc. Automatically enables enrichment.

Response format: 'summary' (~2K tokens with overview and names only), 'filtered' (apply collection/name/mode filters), 'full' (complete dataset from cache or fetch). Default: summary (token-efficient). When format is omitted, filter params (collection/namePattern/mode) auto-select 'filtered', and enrichment/export/resolveAliases/returnAsLinks params auto-select 'full'. Full format returns all data but may be auto-summarized if >25K tokens.

Include published variables from libraries

Include variable dependency graph (requires enrich=true)

Include usage in styles and components (requires enrich=true)

Filter variables by mode name or ID. Only returns variables that have values for this mode. Only applies when format='filtered'. Example: 'Light' or 'Dark'

Filter variables by name using regex pattern or substring. Case-insensitive. Only applies when format='filtered'. Example: 'color/brand' or '^typography'

Page number for paginated results (1-based). Use when response is too large (>1MB). Each page returns up to 50 variables.

Number of variables per page (1-100). Default: 50. Smaller values reduce response size.

DEPRECATED — setting this to true now raises an explicit error. The Puppeteer-based console parser no longer exists. Open the Figma Console MCP Desktop Bridge plugin in Figma Desktop and call figma_get_variables() without parseFromConsole; the plugin returns full variable data through the WebSocket bridge.

Force refresh cache by fetching fresh data from Figma. Use when data may have changed since last fetch. Default: false (use cached data if available and fresh)

Automatically resolve variable aliases to their final values (hex colors, numbers, etc.). When true, each variable will include a 'resolvedValuesByMode' field with the actual values instead of just alias references. Useful for getting color hex values without manual resolution. Default: false.

Return variables as resource_link references instead of full data. Drastically reduces payload size (100+ variables = ~20KB vs >1MB). Recommended for large variable sets — combine with format='filtered' + namePattern/collection/mode to fetch only the variables you need. Default: false

DEPRECATED — has no effect. The console-snippet workflow was removed in the Phase 3 CDP cleanup; the Desktop Bridge plugin now handles all non-REST variable extraction automatically. Kept for parameter compatibility only — safe to ignore.

Controls payload size: 'inventory' (names/IDs only, ~95% smaller, use with filtered), 'summary' (names/values only, ~80% smaller), 'standard' (essential properties, ~45% smaller), 'full' (everything). Default: standard

Import a single variable from a subscribed team library into the current file.

After import, the variable becomes locally addressable by its returned 'id' and can be passed to any tool that binds variables to nodes (fills, strokes, paddings, etc.). The import is idempotent — calling it twice returns the same local id.

**WORKFLOW**:
1. Run figma_get_library_variables to find the variable key
2. Call this tool with that key
3. Use the returned 'id' with figma_set_fills (boundVariables), figma_update_variable, or other binding tools

**REQUIRES** the Desktop Bridge plugin and that the source library is subscribed by the current file (otherwise importVariableByKeyAsync rejects).

The variable key from figma_get_library_variables (collections[].variables[].key). Distinct from the variable's local id.

Push design tokens from your codebase into Figma as variables. Bidirectional with figma_export_tokens.

ACCEPTS: DTCG JSON (canonical, fully supported including round-trip metadata preservation). Tokens Studio JSON, CSS custom properties, Tailwind v4 @theme, SCSS, and Style Dictionary v3 are scaffolded but return a NotImplementedError — convert to DTCG first via figma_export_tokens or hand-author DTCG. Use `format: "auto"` to sniff the input.

APPLY PHASE (full bidirectional sync): toCreate entries create missing collections (with the token file's full mode list) and missing variables in one batched plugin round-trip — literal values first, alias values in a second pass so aliases between newly-created variables resolve. toUpdate entries push value updates in a batched round-trip, INCLUDING alias-target updates: when a token's value is a reference, it's written as a Figma variable alias if the reference resolves to an existing or just-created variable (unresolvable references skip with a warning). toDelete entries are STRICTLY gated behind `strategy: "replace"` — in replace mode, Figma variables absent from the token file are permanently deleted (a loud warning lists the count); merge (default) preserves them and only reports. TIMING/EASING variables cannot be created or written via the Plugin API and are skipped with a warning. Variable scopes and per-platform codeSyntax (from `$extensions["figma-console-mcp"].scopes/.codeSyntax`) are diffed and applied too — absent fields mean "no opinion" (Figma-side metadata is preserved), an explicit value is authoritative. Partial-success semantics: per-item errors surface in applyResult.errors[] without failing the batch.

DIFF-AWARE: Default `strategy: "merge"` diffs against current Figma state and applies only deltas. The hacked-color scenario — designer edits one hex value in their CSS — produces exactly one Figma API update, not a full collection rewrite. Match priority: Figma variable ID (in `$extensions["figma-console-mcp"].variableId`), then exact token path, then value fingerprint.

CONFLICT HANDLING: When BOTH Figma and code changed the same token since the last sync, `onConflict: "ask"` (default) surfaces the conflict and writes nothing. Use `figma-wins` / `code-wins` to auto-resolve, or `skip` to leave conflicts alone and proceed with the rest.

DRY-RUN: Default first call after detecting changes is dry-run for safety. The response includes the full diff plan; user confirms, then call again with `dryRun: false` (or `strategy` other than dry-run) to apply.

Map input token set names to Figma collection names. Example: {'primitives': 'Primitive Tokens'}. When omitted, set names map 1:1 to collection names.

Explicit path to tokens.config.json. When omitted, the tool autodiscovers and uses the config's source.dir to find files. Mutually exclusive with `payload` and `files`.

Shorthand for strategy: 'dry-run'. Computes the diff and returns a preview without applying any changes to Figma.

Multi-file import (used for Tokens Studio's split-set format, or for projects with many DTCG source files). Mutually exclusive with `payload` and `configPath`.

File contents.

Relative or absolute filesystem path.

Format of the input payload. 'auto' (default) detects from payload shape or file extension. Pass an explicit format if auto-detection misfires.

auto dtcg tokens-studio css-vars tailwind-v4 tailwind-v3-config scss style-dictionary-v3 json-flat json-nested

Map input mode names to Figma mode names. Useful when source uses 'light'/'dark' and Figma uses 'Light'/'Dark'. Defaults to 1:1 mapping with case preservation.

How to resolve true two-sided conflicts (both Figma and code changed the same token since last sync). 'ask' (default) surfaces the conflict and writes nothing. 'figma-wins' / 'code-wins' apply the corresponding side. 'skip' leaves conflicted tokens alone but proceeds with the rest.

Single-file content to import. Use this for one-shot imports without setting up tokens.config.json. Mutually exclusive with `files` and `configPath`.

Prefix to strip from input token names on import. E.g. with prefix 'ds-', a token named '--ds-color-primary' becomes 'color/primary'.

How to apply changes. 'merge' (default) diffs against current Figma state and applies only deltas, preserving Figma-only variables. 'replace' wipes the target collections and rewrites. 'dry-run' computes the diff and reports without touching Figma.

Create an instance of a component from the design system.

**CRITICAL: Always pass BOTH componentKey AND nodeId together!**
Search results return both identifiers. Pass both so the tool can automatically fall back to nodeId if the component isn't published to a library. Most local/unpublished components require nodeId.

**IMPORTANT: Always re-search before instantiating!**
NodeIds are session-specific and may be stale from previous conversations. ALWAYS search for components at the start of each design session to get current, valid identifiers.

**VISUAL VALIDATION WORKFLOW:**
After instantiating components, use figma_take_screenshot to verify the result looks correct. Check placement, sizing, and visual balance.

The component key from search results. Pass this WITH nodeId for automatic fallback.

The node ID from search results. ALWAYS pass this alongside componentKey - most local components need it.

Property overrides (e.g., { 'Button Label': 'Click Me' })

Parent node ID to append the instance to

Position on canvas (default: 0, 0)

Variant properties to set (e.g., { Type: 'Simple', State: 'Active' })

Run comprehensive accessibility (WCAG 2.2) and design quality checks on the current page or a specific node tree. WCAG conformance checks (10 rules): color contrast (AA), non-text contrast (1.4.11), color-only differentiation (1.4.1), focus indicators (2.4.7), touch targets (2.5.8), image alt text (1.1.1), heading hierarchy (1.3.1), reflow/responsive (1.4.10), reading order (1.3.2), and disabled context (4.1.2). Best-practice readability hints (opt-in via rules: ['best-practice'] or ['all']): text sizing, line height, letter spacing, paragraph spacing. Note: line/paragraph spacing below 1.5x/2x is NOT a WCAG 1.4.12 failure — 1.4.12 requires supporting user spacing overrides without breaking (a code concern, see figma_scan_code_accessibility), not specific design values — so these are non-normative hints scoped to multi-line text only. Design system checks (5 rules): hardcoded colors, missing text styles, default names, detached components, and token misuse (a semantic token bound to the wrong property, e.g. a bg/* or surface/* variable used as a text fill). Layout checks: missing auto-layout, empty containers. Default audit runs WCAG + design-system + layout (best-practice hints excluded). Returns categorized findings with severity levels (critical/warning/info) and WCAG conformance level (a/aa/aaa/best-practice) so teams can filter by target level. Use natural language like 'check my design for accessibility issues' or 'lint this page'. Requires Desktop Bridge plugin.

Maximum tree depth to traverse (default: 10)

Maximum findings before stopping (default: 100)

Node ID to lint (defaults to current page)

Rule filter. Default (omitted) = ['wcag','design-system','layout'] — real WCAG conformance plus quality checks, with best-practice hints excluded. Groups: ['wcag'] (10 conformance rules), ['best-practice'] (text-size, line-height, letter-spacing, paragraph-spacing), ['all'] (everything incl. best-practice), ['design-system'], ['layout']. Or specific rule IDs like ['wcag-contrast', 'wcag-focus-indicator', 'wcag-disabled-no-context'].

List all Figma files currently connected via the Desktop Bridge plugin. Shows which files have the plugin open and which one is the active target for tool calls. Use figma_navigate to switch between files. WebSocket multi-client mode — each file with the Desktop Bridge plugin maintains its own connection.

List all slides in the current Figma Slides presentation with their IDs, names, grid positions, and skip status. Only works in Slides files.

Move a node to a new position within its parent.

The node ID to move

New X position

New Y position

Switch the active Figma file target among files that already have the Desktop Bridge plugin running. Local mode is WebSocket-only — this tool does NOT launch a browser or open files. If the requested URL is already the active file, it confirms the connection. If another connected plugin matches the URL, it switches the active target so subsequent tool calls hit that file. If no connected plugin matches, returns guidance for the user to open the Desktop Bridge plugin in the target file. Use figma_list_open_files to see all connected files.

Pass lock: true to PIN this file as the target — new connections, reconnects, and the user's own selection/page changes in other files will no longer move the target. Use this for parallel work (agent edits one file while the user works in another) so commands can't silently route to the wrong file. Switching to another file (or lock: false) releases the pin; it also releases automatically if the pinned file disconnects.

Pin this file as the active target so connections, reconnects, and user interaction in other files won't move it. Defaults to false.

Figma URL to navigate to (e.g., https://www.figma.com/design/abc123)

Post a comment on a Figma file, optionally pinned to a specific design node. Use after figma_check_design_parity to notify designers of drift when code is the canonical source. Supports replies to existing comment threads. Limitation: @mentions are a Figma UI-only feature — including '@name' in the message renders as plain text, not a clickable mention tag, and does not trigger Figma notifications.

Figma file URL. Uses current URL if omitted.

The comment message text. Supports basic formatting.

Node ID to pin the comment to (e.g., '695:313'). Comment appears on that element in Figma.

ID of an existing comment to reply to. Creates a threaded reply instead of a new top-level comment.

X coordinate for comment placement (absolute canvas position). Used with node_id.

Y coordinate for comment placement (absolute canvas position). Used with node_id.

Force a complete reconnection to Figma Desktop. Use when connection seems stale or after switching files.

Reload the current Figma page/plugin to test code changes. Optionally clears console logs before reload. Use when user says: 'reload plugin', 'refresh page', 'restart plugin', 'test my changes'. Returns reload confirmation and current URL. Best for rapid iteration during plugin development.

Clear console logs before reload

Rename an existing mode in a Figma variable collection. Requires the Desktop Bridge plugin to be running.

The collection ID containing the mode (e.g., 'VariableCollectionId:123:456'). Get this from figma_get_variables.

The mode ID to rename (e.g., '123:0'). Get this from the collection's modes array in figma_get_variables.

The new name for the mode (e.g., 'Dark Theme', 'Tablet').

Rename a node in the layer panel.

The new name for the node

The node ID to rename

Rename an existing Figma variable. This updates the variable's name while preserving all its values and settings. Requires the Desktop Bridge plugin to be running.

The new name for the variable. Can include slashes for grouping (e.g., 'colors/primary/background').

The variable ID to rename (e.g., 'VariableID:123:456'). Get this from figma_get_variables.

Reorder slides by providing a new 2D array of slide IDs. Each inner array represents a row in the grid. WARNING: This is a destructive operation.

2D array of slide IDs representing the new order, e.g. [['1:2','1:3'],['1:4']]

Reset a slot on a component instance to its default (empty) state from the main component. Uses SlotNode.resetSlot().

Instance ID — use with slotName when slotId is unknown

Direct SlotNode ID

Slot layer name on the instance

Resize a node to specific dimensions. By default respects child constraints; use withConstraints=false to ignore them.

New height in pixels

The node ID to resize

New width in pixels

Whether to apply child constraints during resize (default: true)

Scan HTML code for accessibility violations using axe-core (Deque). Runs structural/semantic checks via JSDOM: ARIA attributes, roles, labels, alt text, form labels, heading order, landmarks, semantic HTML, tabindex, duplicate IDs, lang attribute, and ~50 more rules. Visual checks (color contrast, focus visibility) are disabled in this mode — use figma_lint_design for visual a11y on the design side. Also surfaces a WCAG 1.4.12 (Text Spacing) / 1.4.4 (Resize Text) advisory when typography is locked to fixed px units — the code side is where text-spacing override support is actually verified (a sub-1.5 line height in a design is not itself a failure). Together, these two tools provide full-spectrum accessibility coverage across design and code. Pass component HTML directly or use with figma_check_design_parity for design-to-code a11y comparison. No Figma connection required — this is a standalone code analysis tool.

CSS selector to scope the scan to a specific element (e.g., '#my-component', '.card'). Scans entire document if omitted.

HTML string to scan. Can be a full document or a component fragment (will be wrapped in a valid document).

If true, includes count of passing and incomplete rules in the response (default: false).

If true, includes a codeSpec.accessibility object auto-extracted from the HTML + scan results. Pass this directly into figma_check_design_parity's codeSpec.accessibility field for automated design-to-code a11y parity checking.

WCAG tag filter. Examples: ['wcag2a'], ['wcag2aa'], ['wcag21aa'], ['wcag22aa'], ['best-practice']. Defaults to all structural rules if omitted.

Search for components by name, category, or description. Returns paginated results with component keys for instantiation. Automatically loads the design system cache if needed.

**NEW: Cross-file library search!** Pass a libraryFileKey or libraryFileUrl to search for components in a published shared library (different file). This uses the REST API and requires FIGMA_ACCESS_TOKEN.

Without libraryFileKey/libraryFileUrl, searches the currently open file (local components via Plugin API).

Filter by category (e.g., 'Button', 'Input', 'Card')

File key of a published library to search in (for cross-file library access). Overrides local search.

URL of a published library file to search in (e.g., https://www.figma.com/design/abc123/...). Alternative to libraryFileKey.

Maximum results to return (default: 10, max: 25)

Offset for pagination

Search query to match component names or descriptions

Write or clear annotations on a Figma node. Annotations communicate design specs to developers — use them to document animation timings, easing curves, interaction behaviors, accessibility requirements, and implementation notes. Supports plain text labels, rich markdown labels, pinned design properties, and annotation categories. Pass an empty array to clear all annotations. Use mode='append' to add to existing annotations, or mode='replace' (default) to overwrite. Requires Desktop Bridge plugin. This operation is undoable in Figma (Cmd+Z).

Array of annotations to set. Each annotation can have a label (plain or markdown), pinned properties, and a category. Pass an empty array [] to clear all annotations.

Annotation category ID. Use figma_get_annotation_categories to list available categories.

Plain text annotation label

Rich text annotation label with markdown formatting. Supports bold, italic, links, lists, code, and headers.

Design properties to pin to this annotation (e.g., fills, width, fontSize)

Design property to pin (e.g., 'fills', 'width', 'fontSize')

width height maxWidth minWidth maxHeight minHeight fills strokes effects strokeWeight cornerRadius textStyleId textAlignHorizontal fontFamily fontStyle fontSize fontWeight lineHeight letterSpacing itemSpacing padding layoutMode alignItems opacity mainComponent gridRowGap gridColumnGap gridRowCount gridColumnCount gridRowAnchorIndex gridColumnAnchorIndex gridRowSpan gridColumnSpan

'replace' (default) overwrites all existing annotations. 'append' adds new annotations while keeping existing ones.

Node ID to write annotations to (e.g., '695:313')

Set the description text on a component, component set, or style. Descriptions appear in Dev Mode and help document design intent. Supports plain text and markdown formatting.

The plain text description to set

Optional rich text description using markdown formatting

The node ID of the component or style to update (e.g., '123:456')

Set the fill colors on a node. Accepts hex color strings (e.g., '#FF0000'). To bind a fill to a design token / color variable, pass that fill's variableId — the variable drives the color and this works on any Figma plan via the bridge (no raw figma_execute needed).

Array of fill objects

Hex color string (e.g., '#FF0000', '#FF000080' for transparency). Optional when variableId is provided.

Opacity 0-1 (default: 1)

Fill type (currently only SOLID supported)

Bind this fill's color to a Figma variable by id (e.g. 'VariableID:1:23' from figma_get_variables). When set, the variable drives the color. Import library variables first via figma_import_library_variable.

The node ID to modify

Set an image fill on one or more Figma nodes. The imageData parameter accepts a base64-encoded image string (JPEG/PNG). The image is decoded in the browser bridge and passed as raw bytes to the Figma plugin. Requires Desktop Bridge plugin.

Base64-encoded image data (JPEG/PNG)

Array of node IDs to apply the image fill to

How the image fills the node (default: FILL)

Update component properties on a component instance. IMPORTANT: Use this tool instead of trying to edit text nodes directly when working with component instances. Components often expose TEXT, BOOLEAN, INSTANCE_SWAP, and VARIANT properties that control their content. SLOT properties CANNOT be set here — use figma_append_to_slot to populate slot content. Direct text node editing may fail silently if the component uses properties. This tool handles the #nodeId suffix pattern automatically. Requires Desktop Bridge connection.

ID of the INSTANCE node to update (e.g., '1:234'). Must be a component instance, not a regular frame.

Properties to set. Keys are property names (e.g., 'Label', 'Show Icon', 'Size'). Values are strings for TEXT/VARIANT properties, booleans for BOOLEAN properties. The tool automatically handles the #nodeId suffix for TEXT/BOOLEAN/INSTANCE_SWAP properties.

Set the background color of a slide. Creates or updates a full-slide background rectangle.

Background color as hex (e.g., '#181818')

The node ID of the slide

Set the transition effect for a slide (style, duration, easing curve). Triggers on click by default.

Easing curve

Duration in seconds (0.01 to 10)

The node ID of the slide

Transition style

Toggle the Figma Slides viewport between grid view and single-slide view.

View mode

Set the stroke (border) on a node. Accepts hex color strings and optional stroke weight. To bind a stroke to a design token / color variable, pass that stroke's variableId — works on any Figma plan via the bridge.

The node ID to modify

Stroke thickness in pixels

Array of stroke objects

Hex color string. Optional when variableId is provided.

Opacity 0-1

Stroke type

Bind this stroke's color to a Figma variable by id (e.g. 'VariableID:1:23' from figma_get_variables). When set, the variable drives the color.

Set the text content of a text node. Optionally adjust font size and the font family/style. Font style names are space-sensitive ('Semi Bold', not 'SemiBold'), but this tool auto-corrects common no-space variants and falls back gracefully — so you don't need raw figma_execute to change typography.

Optional font family to apply (e.g., 'Inter')

Optional font size to set

Optional font style/weight to apply (e.g., 'Bold', 'Semi Bold'). No-space variants like 'SemiBold' are auto-corrected.

The text node ID

The new text content

Create a complete design token structure in one operation: collection, modes, and all variables. Ideal for importing CSS custom properties or design tokens into Figma. Values may be literals OR DTCG-style brace references ('{color.blue.600}', or set-qualified '{primitives.color.blue.600}') that resolve to variable ALIASES — first against variables created in this same call, then against existing local variables. Unresolvable references skip that value with a per-item warning (the rest of the batch still applies), so semantic collections referencing primitives no longer need raw figma_execute. Requires Desktop Bridge plugin.

Name for the token collection (e.g., 'Brand Tokens')

Mode names (first becomes default). Example: ['Light', 'Dark']

Token definitions (1-100)

Optional description

Token name (e.g., 'color/primary')

Token type

Values keyed by mode NAME (not ID). Example: { 'Light': '#FFFFFF', 'Dark': '#000000' }. A string value wrapped in braces is an ALIAS reference resolved to another variable: '{color.blue.600}' matches variable name 'color/blue/600' — first among variables created in THIS call, then existing local variables (exact match, then case-insensitive). Set-qualified references ('{primitives.color.blue.600}') strip the leading collection name. Unresolvable references skip that value and surface in the response's warnings[].

Toggle whether a slide is skipped during presentation mode.

True to skip the slide, false to include it

The node ID of the slide

Export an image of the current Figma page or specific node. Uses the Desktop Bridge plugin (exportAsync) when connected — works on any plan, no REST token needed, reflects current runtime state. Falls back to the Figma REST API when the bridge is unavailable or for PDF format. Use for visual validation after design changes — check alignment, spacing, proportions. Pass nodeId to target specific elements. For components, prefer figma_get_component_image.

Image format (default: png)

Optional node ID to screenshot (e.g., '123:456'). If omitted, uses the node-id from the Desktop Bridge plugin's reported file URL when present. To screenshot what the user is currently looking at on the canvas, prefer figma_capture_screenshot (uses the plugin's exportAsync and reflects the current state).

Image scale factor (0.01-4, default: 2 for high quality)

Update a single variable's value and/or its description. Pass modeId+value to change the value in a mode; pass description to set the 'How to use this variable' text shown in the Variables panel (and exported as DTCG $description). At least one of {modeId+value} or {description} is required. For many value updates at once, use figma_batch_update_variables (10-50x faster). Use figma_get_variables first for IDs. COLOR: hex '#FF0000', FLOAT: number, STRING: text, BOOLEAN: true/false. Requires Desktop Bridge plugin.

Set the variable's description (the 'How to use this variable' field; exported as DTCG $description). Pass an empty string to clear it.

The mode ID to update the value in (e.g., '1:0'). Required when updating a value. Get this from the variable's collection modes.

The new value (requires modeId). For COLOR: hex string like '#FF0000'. For FLOAT: number. For STRING: text. For BOOLEAN: true/false.

The variable ID to update (e.g., 'VariableID:123:456'). Get this from figma_get_variables.

Stream console logs in real-time for a specified duration (max 5 minutes). Use for monitoring plugin execution while user tests manually. Returns all logs captured during watch period with summary statistics. NOT for retrieving past logs (use figma_get_console_logs). Best for: watching plugin output during manual testing, debugging race conditions, monitoring async operations.

How long to watch in seconds

Filter by log level


Make an authenticated request to the DataForSEO API

Request body as JSON object or array of task objects

HTTP method

Disable the .ai path suffix and return the full response schema instead of the AI-optimized subset. Can increase context size significantly. Default: false.

API path (e.g. /v3/serp/google/organic/live/regular)

Full API URL (alternative to path)

API Request

Fetch the DataForSEO API documentation index (llms.txt), optionally filtered by section

Filter by API section (e.g. "SERP API")

Docs Index

Return available DataForSEO API documentation section names

Docs List Sections

Fetch DataForSEO API documentation from a documentation URL

Include multi-language code examples (PHP, Node.js, Python, C#)

Documentation URL or path (e.g. https://docs.dataforseo.com/v3/serp/google/organic/live/regular or serp/google/organic/live/regular)

Docs Search