# Figma Mcp Server (`bhansalisoft/figma-mcp-server`) Actor Figma Mcp Server unique tool for integration Figma design into AI Tool for generate Figma Design to Real Html page - **URL**: https://apify.com/bhansalisoft/figma-mcp-server.md - **Developed by:** [bhansalisoft](https://apify.com/bhansalisoft) (community) - **Categories:** AI, Automation, MCP servers - **Stats:** 6 total users, 0 monthly users, 100.0% runs succeeded, 0 bookmarks - **User rating**: No ratings yet ## Pricing from $10.00 / 1,000 results This Actor is paid per event and usage. You are charged both the fixed price for specific events and for Apify platform usage. Learn more: https://docs.apify.com/platform/actors/running/actors-in-store#pay-per-event ## What's an Apify Actor? Actors are a software tools running on the Apify platform, for all kinds of web data extraction and automation use cases. In Batch mode, an Actor accepts a well-defined JSON input, performs an action which can take anything from a few seconds to a few hours, and optionally produces a well-defined JSON output, datasets with results, or files in key-value store. In Standby mode, an Actor provides a web server which can be used as a website, API, or an MCP server. Actors are written with capital "A". ## How to integrate an Actor? If asked about integration, you help developers integrate Actors into their projects. You adapt to their stack and deliver integrations that are safe, well-documented, and production-ready. The best way to integrate Actors is as follows. In JavaScript/TypeScript projects, use official [JavaScript/TypeScript client](https://docs.apify.com/api/client/js.md): ```bash npm install apify-client ``` In Python projects, use official [Python client library](https://docs.apify.com/api/client/python.md): ```bash pip install apify-client ``` In shell scripts, use [Apify CLI](https://docs.apify.com/cli/docs.md): ````bash # MacOS / Linux curl -fsSL https://apify.com/install-cli.sh | bash # Windows irm https://apify.com/install-cli.ps1 | iex ```bash In AI frameworks, you might use the [Apify MCP server](https://docs.apify.com/platform/integrations/mcp.md). If your project is in a different language, use the [REST API](https://docs.apify.com/api/v2.md). For usage examples, see the [API](#api) section below. For more details, see Apify documentation as [Markdown index](https://docs.apify.com/llms.txt) and [Markdown full-text](https://docs.apify.com/llms-full.txt). # README ### *Figma Mcp Server* **Figma MCP Server Tool** will be usefull for convert any Figma Design Files into Working Html or other programing code . you can use this mcp tool with Cursor and Claude and Other AI Tools The **Figma MCP Server Tool ** provides seamless integration between AI assistants and the Figma API. Using the **Model Context Protocol**, this Actor enables natural-language control of Figma filesβ€”extracting components, exporting assets, reading metadata, posting comments, and more, all from tools like **Claude Desktop**, **ChatGPT**, **Cursor**, or any MCP-capable client. ### πŸš€ Key Features #### 🧩 Direct Figma API Integration Access file structure, components, nodes, comments, and metadata with simple MCP commands. #### πŸ“€ Automated Asset Export Export Figma nodes as **PNG, SVG, JPG, or PDF**, including multiple nodes at once. #### πŸ” Design Insight Tools List components, inspect nodes, and extract design structure for dev hand-off or design audits. #### πŸ’¬ Collaboration Ready Read comments, analyze comment threads, and post new comments directly through MCP. #### πŸ” Secure Token Handling Persistent and secure token storage using the MCP tool `save_figma_token`. ### 🧩 Tools Exposed by the Figma MCP Server | Tool Name | Description | | -------------------------------------------------------------- | ----------------------------------------------------- | | **save_figma_token(token)** | Securely save your Figma Personal Access Token (PAT). | | **get_file(file_key)** | Retrieve the full JSON structure of a Figma file. | | **get_node_info(file_key, node_ids_json)** | Fetch metadata for one or more nodes by ID. | | **list_components(file_key)** | List all components published within a file. | | **export_node_images(file_key, node_ids_json, format, scale)** | Export nodes as PNG/SVG/JPG/PDF with custom scaling. | | **list_comments(file_key)** | Retrieve all comments associated with a Figma file. | | **post_comment(file_key, message, x, y, page_id)** | Post a comment to a precise coordinate or node. | ### βš™οΈ MCP Configuration MCP SERVER URL ```` https://bhansalisoft--figma-mcp-server.apify.actor/mcp ```` To connect this Actor to **Claude Desktop** or any MCP client, add to your config: ```json { "mcpServers": { "figma-mcp-server": { "command": "npx", "args": [ "mcp-remote", "https://bhansalisoft--figma-mcp-server.apify.actor/mcp?token=[Your APIFY KEY]" ], "env": { "FIGMA_TOKEN": "[Your FIGMA_TOKEN]" } } } } ```` Replace your \[Your APIFY KEY] and \[Your FIGMA\_TOKEN] Once connected, you’ll see all Figma MCP tools automatically listed in your client. ### πŸ”‘ How to Get Your Figma API Token (PAT) 1. Visit: **** 2. Click **Generate a personal access token** 3. Copy the token 4. Use either method: - Add to Apify input - Or run tool ### Check Demo Video Figma MCP Tool use with Cursor For generate Read html design https://youtu.be/8\_wceB1maTI # Actor input Schema ## Actor input object example ```json {} ``` # Actor output Schema ## `results` (type: `string`): No description # API You can run this Actor programmatically using our API. Below are code examples in JavaScript, Python, and CLI, as well as the OpenAPI specification and MCP server setup. ## JavaScript example ```javascript import { ApifyClient } from 'apify-client'; // Initialize the ApifyClient with your Apify API token // Replace the '' with your token const client = new ApifyClient({ token: '', }); // Prepare Actor input const input = {}; // Run the Actor and wait for it to finish const run = await client.actor("bhansalisoft/figma-mcp-server").call(input); // Fetch and print Actor results from the run's dataset (if any) console.log('Results from dataset'); console.log(`πŸ’Ύ Check your data here: https://console.apify.com/storage/datasets/${run.defaultDatasetId}`); const { items } = await client.dataset(run.defaultDatasetId).listItems(); items.forEach((item) => { console.dir(item); }); // πŸ“š Want to learn more πŸ“–? Go to β†’ https://docs.apify.com/api/client/js/docs ``` ## Python example ```python from apify_client import ApifyClient # Initialize the ApifyClient with your Apify API token # Replace '' with your token. client = ApifyClient("") # Prepare the Actor input run_input = {} # Run the Actor and wait for it to finish run = client.actor("bhansalisoft/figma-mcp-server").call(run_input=run_input) # Fetch and print Actor results from the run's dataset (if there are any) print("πŸ’Ύ Check your data here: https://console.apify.com/storage/datasets/" + run["defaultDatasetId"]) for item in client.dataset(run["defaultDatasetId"]).iterate_items(): print(item) # πŸ“š Want to learn more πŸ“–? Go to β†’ https://docs.apify.com/api/client/python/docs/quick-start ``` ## CLI example ```bash echo '{}' | apify call bhansalisoft/figma-mcp-server --silent --output-dataset ``` ## MCP server setup ```json { "mcpServers": { "apify": { "command": "npx", "args": [ "mcp-remote", "https://mcp.apify.com/?tools=bhansalisoft/figma-mcp-server", "--header", "Authorization: Bearer " ] } } } ``` ## OpenAPI specification ```json { "openapi": "3.0.1", "info": { "title": "Figma Mcp Server", "description": "Figma Mcp Server unique tool for integration Figma design into AI Tool for generate Figma Design to Real Html page", "version": "0.0", "x-build-id": "93l7iIm5b0WsFj9WS" }, "servers": [ { "url": "https://api.apify.com/v2" } ], "paths": { "/acts/bhansalisoft~figma-mcp-server/run-sync-get-dataset-items": { "post": { "operationId": "run-sync-get-dataset-items-bhansalisoft-figma-mcp-server", "x-openai-isConsequential": false, "summary": "Executes an Actor, waits for its completion, and returns Actor's dataset items in response.", "tags": [ "Run Actor" ], "requestBody": { "required": true, "content": { "application/json": { "schema": { "$ref": "#/components/schemas/inputSchema" } } } }, "parameters": [ { "name": "token", "in": "query", "required": true, "schema": { "type": "string" }, "description": "Enter your Apify token here" } ], "responses": { "200": { "description": "OK" } } } }, "/acts/bhansalisoft~figma-mcp-server/runs": { "post": { "operationId": "runs-sync-bhansalisoft-figma-mcp-server", "x-openai-isConsequential": false, "summary": "Executes an Actor and returns information about the initiated run in response.", "tags": [ "Run Actor" ], "requestBody": { "required": true, "content": { "application/json": { "schema": { "$ref": "#/components/schemas/inputSchema" } } } }, "parameters": [ { "name": "token", "in": "query", "required": true, "schema": { "type": "string" }, "description": "Enter your Apify token here" } ], "responses": { "200": { "description": "OK", "content": { "application/json": { "schema": { "$ref": "#/components/schemas/runsResponseSchema" } } } } } } }, "/acts/bhansalisoft~figma-mcp-server/run-sync": { "post": { "operationId": "run-sync-bhansalisoft-figma-mcp-server", "x-openai-isConsequential": false, "summary": "Executes an Actor, waits for completion, and returns the OUTPUT from Key-value store in response.", "tags": [ "Run Actor" ], "requestBody": { "required": true, "content": { "application/json": { "schema": { "$ref": "#/components/schemas/inputSchema" } } } }, "parameters": [ { "name": "token", "in": "query", "required": true, "schema": { "type": "string" }, "description": "Enter your Apify token here" } ], "responses": { "200": { "description": "OK" } } } } }, "components": { "schemas": { "inputSchema": { "type": "object", "properties": {} }, "runsResponseSchema": { "type": "object", "properties": { "data": { "type": "object", "properties": { "id": { "type": "string" }, "actId": { "type": "string" }, "userId": { "type": "string" }, "startedAt": { "type": "string", "format": "date-time", "example": "2025-01-08T00:00:00.000Z" }, "finishedAt": { "type": "string", "format": "date-time", "example": "2025-01-08T00:00:00.000Z" }, "status": { "type": "string", "example": "READY" }, "meta": { "type": "object", "properties": { "origin": { "type": "string", "example": "API" }, "userAgent": { "type": "string" } } }, "stats": { "type": "object", "properties": { "inputBodyLen": { "type": "integer", "example": 2000 }, "rebootCount": { "type": "integer", "example": 0 }, "restartCount": { "type": "integer", "example": 0 }, "resurrectCount": { "type": "integer", "example": 0 }, "computeUnits": { "type": "integer", "example": 0 } } }, "options": { "type": "object", "properties": { "build": { "type": "string", "example": "latest" }, "timeoutSecs": { "type": "integer", "example": 300 }, "memoryMbytes": { "type": "integer", "example": 1024 }, "diskMbytes": { "type": "integer", "example": 2048 } } }, "buildId": { "type": "string" }, "defaultKeyValueStoreId": { "type": "string" }, "defaultDatasetId": { "type": "string" }, "defaultRequestQueueId": { "type": "string" }, "buildNumber": { "type": "string", "example": "1.0.0" }, "containerUrl": { "type": "string" }, "usage": { "type": "object", "properties": { "ACTOR_COMPUTE_UNITS": { "type": "integer", "example": 0 }, "DATASET_READS": { "type": "integer", "example": 0 }, "DATASET_WRITES": { "type": "integer", "example": 0 }, "KEY_VALUE_STORE_READS": { "type": "integer", "example": 0 }, "KEY_VALUE_STORE_WRITES": { "type": "integer", "example": 1 }, "KEY_VALUE_STORE_LISTS": { "type": "integer", "example": 0 }, "REQUEST_QUEUE_READS": { "type": "integer", "example": 0 }, "REQUEST_QUEUE_WRITES": { "type": "integer", "example": 0 }, "DATA_TRANSFER_INTERNAL_GBYTES": { "type": "integer", "example": 0 }, "DATA_TRANSFER_EXTERNAL_GBYTES": { "type": "integer", "example": 0 }, "PROXY_RESIDENTIAL_TRANSFER_GBYTES": { "type": "integer", "example": 0 }, "PROXY_SERPS": { "type": "integer", "example": 0 } } }, "usageTotalUsd": { "type": "number", "example": 0.00005 }, "usageUsd": { "type": "object", "properties": { "ACTOR_COMPUTE_UNITS": { "type": "integer", "example": 0 }, "DATASET_READS": { "type": "integer", "example": 0 }, "DATASET_WRITES": { "type": "integer", "example": 0 }, "KEY_VALUE_STORE_READS": { "type": "integer", "example": 0 }, "KEY_VALUE_STORE_WRITES": { "type": "number", "example": 0.00005 }, "KEY_VALUE_STORE_LISTS": { "type": "integer", "example": 0 }, "REQUEST_QUEUE_READS": { "type": "integer", "example": 0 }, "REQUEST_QUEUE_WRITES": { "type": "integer", "example": 0 }, "DATA_TRANSFER_INTERNAL_GBYTES": { "type": "integer", "example": 0 }, "DATA_TRANSFER_EXTERNAL_GBYTES": { "type": "integer", "example": 0 }, "PROXY_RESIDENTIAL_TRANSFER_GBYTES": { "type": "integer", "example": 0 }, "PROXY_SERPS": { "type": "integer", "example": 0 } } } } } } } } } } ```