# Figma

## Figma – Connector Configuration

### Step 1: Access Figma & Developer Platform

* Sign in to your Figma account at [Figma](https://www.figma.com/)
* Navigate to the [Figma Developer Platform](https://www.figma.com/developers)
* You need a Figma account to create applications (free account works)

> ⚠️ **Note**: Some API features require a Figma Professional or Organization plan.

***

### Step 2: Create Your Application

1. **Access Developer Settings**:
   * Go to **Account Settings** → **Connected apps**
   * Or visit: `https://www.figma.com/developers/apps`
2. **Create New App**:
   * Click **"Create new app"**
   * Fill in the application details:
     * **App name** (e.g., "Appmixer Design Integration")
     * **App description** - Describe your integration's purpose
     * **App website** - Your organization's website (optional)

***

### Step 3: Configure OAuth Settings

1. **OAuth Configuration**:
   * In your app settings, configure OAuth details
   * Set your callback URL for OAuth flow
2. **Set Callback URL**:
   * Add your OAuth redirect URI in the **"Callback URL"** field
   * For Appmixer, set the redirect URI to:

```http
https://[YOUR_API_BASE]/auth/figma/callback
```

Example:

```http
https://api.appmixer.com/auth/figma/callback
```

3. **OAuth Scopes**:
   * Figma OAuth provides access to:
     * **File access** - Read and write files
     * **Team access** - Access team information
     * **Webhook access** - Register and manage webhooks

***

### Step 4: Copy Your OAuth Credentials

After creating your application, you'll find:

* **Client ID** - Your OAuth application identifier
* **Client Secret** - Your OAuth application secret

⚠️ **Important**: Keep your Client Secret secure and never expose it in client-side code!

***

### Step 5: Personal Access Token (Alternative)

For server-to-server integrations, you can use personal access tokens:

1. **Generate Personal Access Token**:
   * Go to **Account Settings** → **Personal access tokens**
   * Click **"Create new token"**
   * Give it a descriptive name
   * Select appropriate scopes:
     * **File content** - Read file structure and content
     * **File comments** - Read and write comments
     * **File dev resources** - Access dev mode resources
2. **Token Security**:
   * Copy the token immediately (it won't be shown again)
   * Store securely and treat like a password
   * Tokens inherit your account permissions

***

### Step 6: Webhook Configuration (Optional)

Figma supports webhooks for real-time file updates:

1. **Create Webhook**:
   * Use the [Webhooks API](https://www.figma.com/developers/api#webhooks)
   * POST to `https://api.figma.com/v2/webhooks`
2. **Webhook Events**:
   * `FILE_UPDATE` - File content changes
   * `FILE_DELETE` - File deletion
   * `FILE_VERSION_UPDATE` - New version created
   * `LIBRARY_PUBLISH` - Library component published
3. **Webhook Payload Example**:

```json
{
  "event_type": "FILE_UPDATE",
  "file_key": "ABC123",
  "timestamp": "2023-01-01T12:00:00Z"
}
```

***

### Step 7: Connector Configuration

1. Go to the Appmixer BackOffice -> Configuration.
2. Add new configuration: `acme:figma`.
3. Add your `clientId` and `clientSecret` keys with values from Figma.

![alt text](/files/meWbqRTSh0m9n5Kq4TiD)

![alt text](/files/8OqSjPWDiA9UbvGqp1sm)

***

### Step 8: Rate Limits

**Rate Limits**:

* **Personal tokens**: 1000 requests per hour
* **OAuth apps**: 1000 requests per hour per user
* **Burst limit**: 120 requests per minute
* **File access**: Additional limits on large files

***

### Important Notes

⚠️ **File Access**:

* OAuth apps can only access files the user has permission to view
* Team files require appropriate team membership
* Private files require explicit sharing

⚠️ **API Limitations**:

* Read-only API (cannot modify file content via API)
* Comments and dev resources can be modified
* File exports have size and complexity limits

⚠️ **Webhook Delivery**:

* Webhooks may be delayed during high traffic
* Implement proper retry logic for failed deliveries
* Validate webhook signatures for security

***

### Useful Links

* [Figma API Documentation](https://www.figma.com/developers/api)
* [OAuth Documentation](https://www.figma.com/developers/api#oauth2)
* [Webhooks Guide](https://www.figma.com/developers/api#webhooks)
* [Plugin Development](https://www.figma.com/plugin-docs/)
* [Community Forum](https://forum.figma.com/c/developers-api/)
* [Rate Limits](https://www.figma.com/developers/api#rate-limiting)

***


---

# Agent Instructions: 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:

```
GET https://docs.appmixer.com/connector-configuration/figma.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.