> For the complete documentation index, see [llms.txt](https://docs.planetcrust.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.planetcrust.com/human-connections/figma/figma.md).

# Figma

<p align="center"><a class="button primary" data-icon="circle-caret-right">Try @Human</a><a class="button primary" data-icon="check">Buy @Human Subscription</a><a class="button primary" data-icon="comments">Join @Human Community</a></p>

<figure><img src="/files/JLkgkWoVVHsFwHMKZyzu" alt="" width="188"><figcaption></figcaption></figure>

<h3 align="center">Put Figma to Work with @Human Automations and @Human Agents</h3>

<p align="center">The Figma Connection documents all Triggers, Actions and Query Operations available for creating automations via the Figma API.</p>

{% embed url="<https://www.youtube.com/watch?v=CyuUuaBSZzA>" %}

#### What can you do with the Figma Connection?

* Connect to the Figma API in a few clicks
* Use the related Figma Operations (see below) in @Human Automations or @Human Agents

### Related Operations

#### Trigger Operations

**File Updated**

Triggers on: files/file\_updated

Triggered when a Figma file is updated.

**Comment Created**

Triggers on: comments/comment\_created

Triggered when a new comment is created on a Figma file.

#### Action Operations

[Action: Create Comment](/human-connections/figma/figma/action-create-comment.md)

[Action: Create Image](/human-connections/figma/figma/action-create-image.md)

[Action: Delete Comment](/human-connections/figma/figma/action-delete-comment.md)

[Action: React to Comment](/human-connections/figma/figma/action-react-to-comment.md)

#### Query Operations

Example link

### Related Automations

Example link

### Obtaining Access Credentials

To obtain a **Personal Access Token (PAT)** for **Figma**, follow these steps:

1. **Log in** to your Figma account at <https://www.figma.com>.
2. Click on your **profile icon** (top-left) → Select **Settings**.
3. In the upper sidebar, go to **Security.**
4. Click **Generate new token**.
5. Enter a **description** for the token (e.g., "API Access").
6. Set an **expiration date**.
7. Under **Scopes**, select the required permissions (e.g., `files:read`, `files:write`).
8. Click **Generate token**.
9. **Copy the token** immediately—it won’t be shown again. *Store it securely; treat it like a password.*

### Configuring Webhooks

1. **Generate a Personal Access Token (PAT)** in Figma with the `webhooks:write` scope enabled.
2. **Determine the scope** for your webhook (Team, Project, or File) and locate its corresponding ID.
3. **Set up a public endpoint** capable of receiving `POST` requests and returning a `200 OK` status code.
4. **Register the webhook** by sending a `POST` request to `https://api.figma.com/v2/webhooks`.
5. **Add the header** `X-Figma-Token` using your Personal Access Token as the value.
6. **Include a JSON body** specifying the `event_type`, the resource ID (`team_id`, `project_id`, or `file_id`), your `endpoint` URL, and a `passcode` for verification.
7. **Confirm registration** by verifying the automated `PING` event sent by Figma to your specified endpoint.

### Code (Apache v2.0): Service Connectivity and Metadata

```
{
  "handle": "figma",
  "status": "active",
  "meta": {
    "short": "Figma",
    "description": "Connect to Figma to manage design files, comments, and projects.",
    "icon": "figma",
    "tags": ["design", "collaboration", "api"]
  },
  "service": {
    "baseURL": {
      "value": "https://api.figma.com/v1"
    },
    "protocol": "https",
    "contentType": "application/json",
    "headers": {
      "X-Figma-Token": {
        "value": "{{apiToken}}"
      }
    },
    "auth": {
      "method": "api_token",
      "params": {
        "apiToken": {
          "token": {
            "value": "{{apiToken}}",
            "placeholders": [
              {
                "name": "apiToken",
                "type": "String",
                "description": "Figma personal access token",
                "required": true
              }
            ]
          },
          "headerName": {
            "value": "X-Figma-Token"
          }
        }
      }
    }
  }
}

```

### Code (Apache v2.0): List of External Resources and Internal Mapping

```
[
  {
    "handle": "files",
    "meta": {
      "short": "Files",
      "description": "Manage Figma design files, including retrieval, creation, and updates."
    },
    "endpoint": {
      "value": "/v1/files/{{fileKey}}",
      "placeholders": [
        {
          "name": "fileKey",
          "type": "String",
          "description": "The unique key of the Figma file",
          "required": true
        }
      ]
    },
    "fields": [
      {
        "name": "name",
        "type": "String",
        "selector": [
          "name"
        ],
        "meta": {
          "description": "Name of the Figma file"
        }
      },
      {
        "name": "lastModified",
        "type": "String",
        "selector": [
          "lastModified"
        ],
        "meta": {
          "description": "Last modified timestamp of the file"
        }
      },
      {
        "name": "thumbnailUrl",
        "type": "String",
        "selector": [
          "thumbnail",
          "url"
        ],
        "meta": {
          "description": "URL to the thumbnail image of the file"
        }
      },
      {
        "name": "document_id",
        "type": "String",
        "selector": [
          "document",
          "id"
        ],
        "meta": {
          "description": "ID of the root document node."
        }
      },
      {
        "name": "document_type",
        "type": "String",
        "selector": [
          "document",
          "type"
        ],
        "meta": {
          "description": "Type of the root node (always 'DOCUMENT')."
        }
      },
      {
        "name": "document_name",
        "type": "String",
        "selector": [
          "document",
          "name"
        ],
        "meta": {
          "description": "Name of the root document node."
        }
      }
    ],
    "operations": {
      "read": {
        "method": "GET",
        "path": {
          "value": "",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {},
        "bodyTemplate": null
      },
      "update": {
        "method": "PATCH",
        "path": {
          "value": "",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}",
          "Content-Type": "application/json"
        },
        "queryParams": {},
        "bodyTemplate": {
          "value": "{\"name\": \"{{name}}\"}",
          "placeholders": [
            {
              "name": "name",
              "type": "String",
              "description": "New name for the file",
              "required": false
            }
          ]
        }
      }
    },
    "webhooks": [
      {
        "event": "file_updated",
        "path": "/webhooks/figma/file-updated",
        "payload": [
          {
            "name": "fileKey",
            "type": "String",
            "selector": [
              "file_key"
            ],
            "meta": {
              "description": "The unique key of the updated file"
            }
          },
          {
            "name": "timestamp",
            "type": "String",
            "selector": [
              "timestamp"
            ],
            "meta": {
              "description": "When the file was updated"
            }
          }
        ]
      }
    ]
  },
  {
    "handle": "projects",
    "meta": {
      "short": "Projects",
      "description": "Manage Figma projects, including listing files within a project."
    },
    "endpoint": {
      "value": "/v1/projects/{{projectId}}",
      "placeholders": [
        {
          "name": "projectId",
          "type": "String",
          "description": "The unique ID of the Figma project",
          "required": true
        }
      ]
    },
    "fields": [
      {
        "name": "name",
        "type": "String",
        "selector": [
          "name"
        ],
        "meta": {
          "description": "Name of the project"
        }
      },
      {
        "name": "files_0_key",
        "type": "String",
        "selector": [
          "files",
          0,
          "key"
        ],
        "meta": {
          "description": "Unique key of the first file in the project."
        },
        "multivalue": true
      },
      {
        "name": "files_0_name",
        "type": "String",
        "selector": [
          "files",
          0,
          "name"
        ],
        "meta": {
          "description": "Name of the first file in the project."
        },
        "multivalue": true
      },
      {
        "name": "files_0_last_modified",
        "type": "String",
        "selector": [
          "files",
          0,
          "last_modified"
        ],
        "meta": {
          "description": "Last modified timestamp of the first file."
        },
        "multivalue": true
      },
      {
        "name": "files_0_thumbnail_url",
        "type": "String",
        "selector": [
          "files",
          0,
          "thumbnail_url"
        ],
        "meta": {
          "description": "Thumbnail URL of the first file."
        },
        "multivalue": true
      }
    ],
    "operations": {
      "read": {
        "method": "GET",
        "path": {
          "value": "",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {},
        "bodyTemplate": null
      },
      "list": {
        "method": "GET",
        "path": {
          "value": "/files",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {},
        "bodyTemplate": null
      }
    },
    "webhooks": []
  },
  {
    "handle": "comments",
    "meta": {
      "short": "Comments",
      "description": "Manage comments on Figma files, including listing, creating, and resolving comments."
    },
    "endpoint": {
      "value": "/v1/files/{{fileKey}}/comments",
      "placeholders": [
        {
          "name": "fileKey",
          "type": "String",
          "description": "The unique key of the Figma file",
          "required": true
        }
      ]
    },
    "fields": [
      {
        "name": "id",
        "type": "String",
        "selector": [
          "id"
        ],
        "meta": {
          "description": "Unique identifier for the comment"
        }
      },
      {
        "name": "message",
        "type": "String",
        "selector": [
          "message"
        ],
        "meta": {
          "description": "The content of the comment"
        }
      },
      {
        "name": "resolved",
        "type": "Boolean",
        "selector": [
          "resolved"
        ],
        "meta": {
          "description": "Whether the comment has been resolved"
        }
      },
      {
        "name": "createdAt",
        "type": "String",
        "selector": [
          "created_at"
        ],
        "meta": {
          "description": "Timestamp when the comment was created"
        }
      }
    ],
    "operations": {
      "list": {
        "method": "GET",
        "path": {
          "value": "",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {},
        "bodyTemplate": null
      },
      "create": {
        "method": "POST",
        "path": {
          "value": "",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}",
          "Content-Type": "application/json"
        },
        "queryParams": {},
        "bodyTemplate": {
          "value": "{\"message\": \"{{message}}\", \"client_meta\": {\"node_id\": \"{{nodeId}}\"}}",
          "placeholders": [
            {
              "name": "message",
              "type": "String",
              "description": "The comment message",
              "required": true
            },
            {
              "name": "nodeId",
              "type": "String",
              "description": "The node ID the comment refers to",
              "required": false
            }
          ]
        }
      },
      "delete": {
        "method": "DELETE",
        "path": {
          "value": "/{{commentId}}",
          "placeholders": [
            {
              "name": "commentId",
              "type": "String",
              "description": "The ID of the comment to delete",
              "required": true
            }
          ]
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {},
        "bodyTemplate": null
      }
    },
    "webhooks": [
      {
        "event": "comment_created",
        "path": "/webhooks/figma/comment-created",
        "payload": [
          {
            "name": "fileKey",
            "type": "String",
            "selector": [
              "file_key"
            ],
            "meta": {
              "description": "The file key where the comment was created"
            }
          },
          {
            "name": "commentId",
            "type": "String",
            "selector": [
              "comment_id"
            ],
            "meta": {
              "description": "The ID of the created comment"
            }
          }
        ]
      }
    ]
  },
  {
    "handle": "file_nodes",
    "meta": {
      "short": "File Nodes",
      "description": "Read specific nodes from a Figma file."
    },
    "endpoint": {
      "value": "/v1/files/{{fileKey}}/nodes",
      "placeholders": [
        {
          "name": "fileKey",
          "type": "String",
          "description": "The unique key of the Figma file",
          "required": true
        }
      ]
    },
    "fields": [
      {
        "name": "name",
        "type": "String",
        "selector": [
          "name"
        ],
        "meta": {
          "description": "Name of the file"
        }
      },
      {
        "name": "lastModified",
        "type": "String",
        "selector": [
          "lastModified"
        ],
        "meta": {
          "description": "Last modified timestamp of the file"
        }
      },
      {
        "name": "thumbnailUrl",
        "type": "String",
        "selector": [
          "thumbnailUrl"
        ],
        "meta": {
          "description": "URL to the thumbnail image of the file"
        }
      },
      {
        "name": "version",
        "type": "String",
        "selector": [
          "version"
        ],
        "meta": {
          "description": "File version"
        }
      }
    ],
    "operations": {
      "read": {
        "method": "GET",
        "path": {
          "value": "",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {
          "ids": {
            "value": "{{ids}}",
            "placeholders": [
              {
                "name": "ids",
                "type": "String",
                "description": "Comma-separated list of nodes to retrieve",
                "required": true
              }
            ]
          }
        },
        "bodyTemplate": null
      }
    },
    "webhooks": []
  },
  {
    "handle": "images",
    "meta": {
      "short": "Images",
      "description": "Render images from a Figma file."
    },
    "endpoint": {
      "value": "/v1/images/{{fileKey}}",
      "placeholders": [
        {
          "name": "fileKey",
          "type": "String",
          "description": "The unique key of the Figma file",
          "required": true
        }
      ]
    },
    "fields": [
      {
        "name": "err",
        "type": "String",
        "selector": [
          "err"
        ],
        "meta": {
          "description": "Error message if any"
        }
      }
    ],
    "operations": {
      "list": {
        "method": "GET",
        "path": {
          "value": "",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {
          "ids": {
            "value": "{{ids}}",
            "placeholders": [
              {
                "name": "ids",
                "type": "String",
                "description": "Comma-separated list of nodes to render",
                "required": true
              }
            ]
          },
          "format": {
            "value": "{{format}}",
            "placeholders": [
              {
                "name": "format",
                "type": "String",
                "description": "Image format (e.g. jpg, png, svg, pdf)",
                "required": false
              }
            ]
          }
        },
        "bodyTemplate": null
      }
    },
    "webhooks": []
  },
  {
    "handle": "teams",
    "meta": {
      "short": "Teams",
      "description": "Manage Figma teams and retrieve their projects."
    },
    "endpoint": {
      "value": "/v1/teams/{{teamId}}/projects",
      "placeholders": [
        {
          "name": "teamId",
          "type": "String",
          "description": "The unique ID of the Figma team",
          "required": true
        }
      ]
    },
    "fields": [
      {
        "name": "id",
        "type": "String",
        "selector": [
          "id"
        ],
        "meta": {
          "description": "Project ID"
        }
      },
      {
        "name": "name",
        "type": "String",
        "selector": [
          "name"
        ],
        "meta": {
          "description": "Name of the project"
        }
      }
    ],
    "operations": {
      "list": {
        "method": "GET",
        "path": {
          "value": "",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {},
        "bodyTemplate": null
      }
    },
    "webhooks": []
  },
  {
    "handle": "users",
    "meta": {
      "short": "Users",
      "description": "Retrieve information about the authenticated user."
    },
    "endpoint": {
      "value": "/v1/me",
      "placeholders": []
    },
    "fields": [
      {
        "name": "id",
        "type": "String",
        "selector": [
          "id"
        ],
        "meta": {
          "description": "The unique ID of the user"
        }
      },
      {
        "name": "email",
        "type": "String",
        "selector": [
          "email"
        ],
        "meta": {
          "description": "The user's email address"
        }
      },
      {
        "name": "handle",
        "type": "String",
        "selector": [
          "handle"
        ],
        "meta": {
          "description": "The user's handle"
        }
      },
      {
        "name": "img_url",
        "type": "String",
        "selector": [
          "img_url"
        ],
        "meta": {
          "description": "The URL to the user's avatar image"
        }
      }
    ],
    "operations": {
      "read": {
        "method": "GET",
        "path": {
          "value": "",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {},
        "bodyTemplate": null
      }
    },
    "webhooks": []
  },
  {
    "handle": "webhooks",
    "meta": {
      "short": "Webhooks",
      "description": "Manage Figma webhooks."
    },
    "endpoint": {
      "value": "/v2/webhooks",
      "placeholders": []
    },
    "fields": [
      {
        "name": "id",
        "type": "String",
        "selector": [
          "id"
        ],
        "meta": {
          "description": "The unique ID of the webhook"
        }
      },
      {
        "name": "event_type",
        "type": "String",
        "selector": [
          "event_type"
        ],
        "meta": {
          "description": "The event that triggers the webhook"
        }
      },
      {
        "name": "endpoint",
        "type": "String",
        "selector": [
          "endpoint"
        ],
        "meta": {
          "description": "The URL the webhook sends payloads to"
        }
      },
      {
        "name": "status",
        "type": "String",
        "selector": [
          "status"
        ],
        "meta": {
          "description": "The current status of the webhook"
        }
      }
    ],
    "operations": {
      "list": {
        "method": "GET",
        "path": {
          "value": "",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {},
        "bodyTemplate": null
      },
      "read": {
        "method": "GET",
        "path": {
          "value": "/{{webhookId}}",
          "placeholders": [
            {
              "name": "webhookId",
              "type": "String",
              "description": "The ID of the webhook",
              "required": true
            }
          ]
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {},
        "bodyTemplate": null
      },
      "create": {
        "method": "POST",
        "path": {
          "value": "",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}",
          "Content-Type": "application/json"
        },
        "queryParams": {},
        "bodyTemplate": {
          "value": "{\"event_type\": \"{{event_type}}\", \"team_id\": \"{{team_id}}\", \"endpoint\": \"{{endpoint}}\", \"passcode\": \"{{passcode}}\"}",
          "placeholders": [
            {
              "name": "event_type",
              "type": "String",
              "description": "The event type (e.g. FILE_UPDATE, FILE_COMMENT)",
              "required": true
            },
            {
              "name": "team_id",
              "type": "String",
              "description": "The team ID to monitor",
              "required": true
            },
            {
              "name": "endpoint",
              "type": "String",
              "description": "The URL to send events to",
              "required": true
            },
            {
              "name": "passcode",
              "type": "String",
              "description": "Passcode to authenticate webhook deliveries",
              "required": true
            }
          ]
        }
      },
      "delete": {
        "method": "DELETE",
        "path": {
          "value": "/{{webhookId}}",
          "placeholders": [
            {
              "name": "webhookId",
              "type": "String",
              "description": "The ID of the webhook to delete",
              "required": true
            }
          ]
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {},
        "bodyTemplate": null
      }
    },
    "webhooks": []
  },
  {
    "handle": "variables",
    "meta": {
      "short": "Variables",
      "description": "Manage local and published design variables in a Figma file."
    },
    "endpoint": {
      "value": "/v1/files/{{fileKey}}/variables",
      "placeholders": [
        {
          "name": "fileKey",
          "type": "String",
          "description": "The unique key of the Figma file",
          "required": true
        }
      ]
    },
    "fields": [
      {
        "name": "id",
        "type": "String",
        "selector": [
          "id"
        ],
        "meta": {
          "description": "The unique ID of the variable"
        }
      },
      {
        "name": "name",
        "type": "String",
        "selector": [
          "name"
        ],
        "meta": {
          "description": "The name of the variable"
        }
      },
      {
        "name": "resolvedType",
        "type": "String",
        "selector": [
          "resolvedType"
        ],
        "meta": {
          "description": "The type of the variable (e.g., COLOR, FLOAT, STRING, BOOLEAN)"
        }
      }
    ],
    "operations": {
      "list_local": {
        "method": "GET",
        "path": {
          "value": "/local",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {},
        "bodyTemplate": null
      },
      "list_published": {
        "method": "GET",
        "path": {
          "value": "/published",
          "placeholders": []
        },
        "headers": {
          "X-Figma-Token": "{{apiKey}}"
        },
        "queryParams": {},
        "bodyTemplate": null
      }
    },
    "webhooks": []
  }
]
```

<p align="center"><a class="button primary" data-icon="square-caret-right">Try @Human</a><a class="button primary" data-icon="check">Buy @Human Subscription</a><a class="button primary" data-icon="comments">Join @Human Community</a></p>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.planetcrust.com/human-connections/figma/figma.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
