Zusammenfassung
Lass deine KI deine Figma-Designs lesen: Team-Ordner und Dateien durchblättern, Seiten, Frames und Ebenen untersuchen, Bilder exportieren, Komponenten und Styles nachschlagen, den Versionsverlauf verfolgen, Kommentare lesen und schreiben und Dev-Mode-Links verwalten. Mit einem persönlichen Access-Token.
Geführte Einrichtung
Figma in 2 Minuten mit Microsoft Copilot verbinden
Starte die kostenlose Testphase in der AnythingMCP Cloud, verbinde Figma in der geführten Einrichtung und trag deine MCP-URL in Microsoft Copilot ein. Ohne Code, ohne eigenen Server.
Keine Kreditkarte · 7 Tage Test · Self-Hosting-Alternative verfügbar
Frag einfach
Beispiel-Prompts für Figma
Klick auf einen Prompt, um ihn zu kopieren. In Claude, ChatGPT, Cursor, Gemini, Copilot oder OpenClaw einfügen — und gegen diesen Connector laufen lassen.
Claude ist KI und kann Fehler machen. Bitte Antworten gegenprüfen.
💡 Keine Installation? Nutze cloud.anythingmcp.com direkt. Einloggen, Connectors → Figma klicken, Zugangsdaten einfügen, MCP-API-Key erzeugen, fertig. Kein Docker, kein
git clone, kein lokaler Server.
Figma + Microsoft Copilot
Lass deine KI deine Figma-Designs lesen: Team-Ordner und Dateien durchblättern, Seiten, Frames und Ebenen untersuchen, Bilder exportieren, Komponenten und Styles nachschlagen, den Versionsverlauf verfolgen, Kommentare lesen und schreiben und Dev-Mode-Links verwalten. Mit einem persönlichen Access-Token.
Voraussetzungen
Die vollständige Setup-Anleitung ist in den Connector eingebaut (im Store sichtbar, wenn du den Connector auswählst). Benötigte Umgebungsvariablen für diesen Connector:
FIGMA_ACCESS_TOKEN
Schritt 1 — Zugangsdaten holen
- Öffne in Figma das Kontomenü (oben links im Dateibrowser) → Settings → Security → Personal access tokens → Generate new token.
- Gib dem Token einen Namen (zum Beispiel „AnythingMCP“) und wähle eine Laufzeit: höchstens 90 Tage, denn Tokens ohne Ablaufdatum stellt Figma nicht mehr aus. Setze diese Scopes:
current_user:read,file_content:read,file_metadata:read,file_versions:readfile_comments:read,file_comments:writelibrary_content:read,library_assets:read,team_library_content:readfolders:readfile_dev_resources:read,file_dev_resources:write
- Klicke auf Generate token und kopiere das Token sofort: Figma zeigt es nur einmal an. Es beginnt meist mit
figd_. - Trage das Token ohne das Wort Bearer in
FIGMA_ACCESS_TOKENein, dann installiere den Connector. - Beginne mit
figma_get_me: Das Tool zeigt, zu welchem Figma-Nutzer das Token gehört. Gib der KI dann einen Dateilink: Der Dateischlüssel ist der Teil nach/design/in der URL.
Ablauf des Tokens: Tokens gelten höchstens 90 Tage. Läuft deins ab, erstelle ein neues mit denselben Scopes und trage es erneut in FIGMA_ACCESS_TOKEN ein. Der Connector sieht genau die Dateien und Teams, die der Nutzer des Tokens öffnen kann. Tokens, die erstellt wurden, bevor Figma Projekte in Ordner (Folders) umbenannt hat, haben eventuell nur projects:read, die Ordner-Tools brauchen aber folders:read: Antworten sie mit 403 und nennen einen Scope, erstelle ein neues Token.
Teams und Ordner finden: Figma kann deine Teams über die API nicht auflisten. Gib der KI den Link einer Teamseite aus dem Dateibrowser (die Team-ID ist die Zahl nach /team/); über figma_list_team_folders, figma_list_subfolders und figma_list_folder_files kommt sie dann zu den Dateien.
Berechtigungen und Nur lesen: Lass file_comments:write und file_dev_resources:write weg und schalte figma_post_comment, figma_delete_comment, figma_add_comment_reaction, figma_create_dev_resource und figma_update_dev_resource aus. Kommentare, die die KI schreibt, erscheinen unter dem Namen des Token-Nutzers, und alle mit Zugriff auf die Datei sehen sie.
Bei der Installation ausgeschaltet: figma_delete_dev_resource, das einen Dev-Mode-Link für alle von einem Node entfernt. Schalte das Tool nur ein, wenn die KI Dev Resources löschen soll.
Rate Limits und Starter-Plan: Figma begrenzt Anfragen pro Nutzer und nach dem Plan, in dem die Datei liegt. Dateiinhalte, Nodes und Bild-Renderings (figma_get_file, figma_get_file_nodes, figma_render_images) haben das engste Limit: 10 bis 20 pro Minute in einem bezahlten Plan mit Full- oder Dev-Seat, aber nur eine Handvoll pro Monat für Dateien im kostenlosen Starter-Plan oder mit einem View- oder Collab-Seat. Metadaten, Kommentare, Versionen, Komponenten und Styles erlauben deutlich mehr. Bitte die KI, einzelne Frames statt ganzer Dateien anzusehen; sehr große Antworten werden bei 200 KB abgeschnitten. Links zu gerenderten Bildern bleiben 30 Tage gültig.
Dev Mode: Dev Resources (Links zu Tickets, Dokus oder Code an einem Node) brauchen einen bezahlten Plan und einen Full- oder Dev-Seat. Ohne Dev-Mode-Zugriff antwortet Figma den Dev-Resource-Tools mit „File not found“, auch bei einer Datei, die die anderen Tools problemlos lesen. Ein Node hat höchstens 10 Dev Resources, jede URL nur einmal.
Häufige Fehler: 401 „Invalid token“ heißt, dass das Token falsch, abgelaufen oder widerrufen ist: Erstelle ein neues. 403 heißt, dass dem Token ein Scope fehlt (die Meldung nennt ihn) oder der Nutzer keinen Zugriff auf dieses Team oder diesen Ordner hat. 404 heißt, dass es die Datei oder den Node nicht gibt oder der Nutzer die Datei nicht öffnen kann: Kopiere den Schlüssel aus der URL der Datei. 400 nennt einen ungültigen Parameter, zum Beispiel eine Node-ID mit Bindestrich statt Doppelpunkt (aus node-id=12-345 in einem Link wird 12:345). 429 ist ein Rate Limit: Warte und versuche es erneut. Die Bibliotheks-Tools lehnen den Schlüssel eines Branches ab: Nimm den Schlüssel der Hauptdatei.
Der Connector bearbeitet keine Designs und unterstützt keine Variablen, Webhooks, FigJam- und Slides-Inhalte über den Dateibaum hinaus und keine Bibliotheksanalysen.
Schritt 2 — Adapter installieren
curl -fsSL https://raw.githubusercontent.com/HelpCode-ai/anythingmcp/main/docker-compose.quickstart.yml -o docker-compose.yml
printf 'JWT_SECRET=%s\nENCRYPTION_KEY=%s\n' "$(openssl rand -hex 32)" "$(openssl rand -hex 32)" > .env
docker compose up -d
Schritt 3 — Connector in Microsoft Copilot hinzufügen
Deine Server-URL: Öffne in AnythingMCP MCP Servers → den Server, auf dem dieser Connector liegt, und kopiere seine URL (
https://cloud.anythingmcp.com/mcp/…). Setze sie überall ein, wo diese AnleitungYOUR_SERVER_IDzeigt.
Microsoft Copilot nutzt MCP-Server über Agents, die du in Copilot Studio baust: Du fügst AnythingMCP einem Agent als Tool hinzu und veröffentlichst den Agent dann in Microsoft 365 Copilot und Teams. Copilot Studio verbindet sich aus der Cloud von Microsoft per Streamable HTTP, das AnythingMCP unterstützt.
- Öffne in Copilot Studio deinen Agent (oder leg einen an), geh zu Tools und wähle Add a tool → New tool → Model Context Protocol.
- Trag einen Server name ein (zum Beispiel
AnythingMCP), eine Server description, die sagt, was der Connector kann, und die Server URLhttps://cloud.anythingmcp.com/mcp/YOUR_SERVER_ID. Anhand der Beschreibung entscheidet Copilot Studio, wann es den Server aufruft. - Wähle bei der Authentifizierung API key, setze Type auf Header und den Header-Namen auf
X-API-Keyund klicke auf Create. - Wähle in Add tool die Option Create a new connection, füge einen MCP-API-Key aus AnythingMCP ein (MCP Servers → dein Server → API keys) und klicke auf Add to agent.
- Probier es im Test-Bereich des Agents aus: Bitte um etwas, wofür er die
Figma-Tools braucht. - Klicke auf Publish, dann auf Channels → Microsoft 365 and Microsoft Teams, lass Make agent available in Microsoft Copilot aktiviert und wähle Add channel. See agent in Teams installiert den Agent für dich; in Microsoft 365 Copilot tippst du @ und wählst den Agent aus.
Lieber eine Anmeldung pro Person? Wähle statt API key OAuth 2.0 → Dynamic discovery: Dann meldet sich jede Person beim ersten Aufruf des Agents bei AnythingMCP an.
Du hostest selbst? Nimm statt https://cloud.anythingmcp.com die öffentliche HTTPS-Adresse deiner Instanz. Copilot Studio verbindet sich aus der Cloud von Microsoft, localhost funktioniert deshalb nicht.
Verfügbare Tools
| Tool | What it does |
|---|---|
figma_get_me | Get the Figma user the token belongs to: id, handle, email and avatar URL |
figma_get_file_meta | Get a file's metadata without its content: name, folder name, editor type (figma, figjam, slides ...), creator, last_touched_at and by… |
figma_get_file | Read a file's document tree: pages, frames and layers with their ids, names, types, sizes, fills, text and layout, plus the components and… |
figma_get_file_nodes | Read specific nodes (frames, components, layers) of a file with everything below them: type, name, absolute bounding box, fills, strokes… |
figma_render_images | Render nodes of a file as PNG, JPG, SVG or PDF and get a download URL per node id (null when a node could not be rendered) |
figma_get_image_fills | Get download URLs for every image used as a fill in a file, keyed by imageRef (the imageRef in a node's fills) |
figma_list_versions | List a file's version history, newest first: id, label and description of named versions, created_at, the user and thumbnail |
figma_list_comments | List all comments on a file: id, message, user, created_at, resolved_at, parent_id (for replies), client_meta (where it is pinned: node_id… |
figma_post_comment | Post a comment on a file as the token's user, optionally pinned to a node or a point, or as a reply to a top-level comment (comment_id) |
figma_delete_comment | Delete a comment |
figma_list_comment_reactions | List the emoji reactions on a comment: emoji, user and created_at |
figma_add_comment_reaction | React to a comment with an emoji shortcode, as the token's user; it shows next to the comment |
figma_list_team_folders | List the top-level folders (formerly called projects) of a team that the token's user can see: id, name, parent_folder_id (null at the… |
figma_list_subfolders | List the folders directly inside a folder (folders can be nested): id, name, parent_folder_id and created_at, plus the parent folder's name |
figma_list_folder_files | List the files directly in a folder (not in its subfolders): key, name, thumbnail_url and last_modified, plus the folder's name |
figma_list_team_components | List the published components of a team library: key, name, description, the file and node they live in, thumbnail and who last updated them |
figma_list_team_component_sets | List the published component sets (components with variants) of a team library: key, name, description, the file and node they live in… |
figma_list_team_styles | List the published styles (colors, text, effects, grids) of a team library: key, name, description, the file and node they live in… |
figma_list_file_components | List the published components of a library file: key, name, description, node_id and thumbnail |
figma_list_file_component_sets | List the published component sets of a library file: key, name, description, node_id and thumbnail |
figma_list_file_styles | List the published styles of a library file: key, name, description, node_id and thumbnail |
figma_get_component | Get one published component by its key: name, description, the file and node it lives in, its containing frame and component set, thumbnail… |
figma_get_component_set | Get one published component set (a component with variants) by its key: name, description, file, node and thumbnail |
figma_get_style | Get one published style by its key: name, description, style_type (FILL, TEXT, EFFECT, GRID), the file and node it lives in and thumbnail |
figma_list_dev_resources | List the dev resources of a file: links that developers attached to nodes in Dev Mode (tickets, docs, code), each with id, name, url and… |
figma_create_dev_resource | Attach a link (a ticket, a doc, a code file) to a node as a dev resource, visible to everyone in Dev Mode |
figma_update_dev_resource | Change the name or URL of a dev resource |
figma_delete_dev_resource | Remove a dev resource link from a node, for everyone |
Beispiel-Prompts
- „Zeig mir die Seiten und wichtigsten Frames der Datei Checkout-Redesign und wer sie zuletzt bearbeitet hat.“
- „Welche Kommentare in der Datei Checkout-Redesign sind noch offen, und wer hat sie geschrieben?“
- „Exportiere den Frame Preisseite aus der Datei Acme-Website als PNG und gib mir den Link.“
- „Antworte auf Lenas Kommentar in der Datei Checkout-Redesign und schreib ihr, dass die Button-Farbe angepasst ist.“
FAQ
Für welchen Copilot gilt das? Für Microsoft 365 Copilot im Unternehmen, über Agents aus Copilot Studio. Die Microsoft-Copilot-App für private Konten bietet keine Möglichkeit, einen eigenen MCP-Server hinzuzufügen.
Was brauche ich? Ein Arbeitskonto mit Zugang zu Copilot Studio (Lizenz oder Testversion), um den Agent zu bauen. Wer ihn in Microsoft 365 Copilot oder Teams nutzen soll, braucht Zugriff auf den Agent: Teile ihn oder lass ihn von einem Admin für die Organisation veröffentlichen. Wendet deine Organisation Datenrichtlinien auf Power-Platform-Connectors an, gelten sie auch für MCP-Server.
Der Agent ruft die Tools nicht auf. Prüfe, dass der Header-Name genau X-API-Key lautet und der Schlüssel zum selben MCP-Server gehört wie die URL, und formuliere die Server description konkret: Copilot Studio entscheidet anhand der Beschreibung, wann es den Server aufruft. Veröffentliche den Agent nach jeder Änderung erneut; in einem offenen Chat holst du die neue Version mit „start over“.
Nächste Schritte
- Connector-Startseite
- Mit Claude verbinden
- Mit ChatGPT verbinden
- Mit Cursor verbinden
- Mit Gemini verbinden
- Mit Meta Muse verbinden
War dieser Guide hilfreich?