figma-mcp-go

Figma MCP — Kostenlos, keine Ratenbegrenzungen

Open-Source Figma MCP-Server mit vollem Lese-/Schreibzugriff über ein Plugin – keine REST-API, keine Ratenbegrenzungen. Verwandeln Sie Text in Designs und Designs in echten Code. Funktioniert mit Cursor, Claude, GitHub Copilot und jedem MCP-kompatiblen KI-Tool.

Highlights

Kein Figma API-Token erforderlich
Keine Ratenbegrenzungen – ideal für den kostenlosen Plan
Lesen und Schreiben von Live-Figma-Daten über eine Plugin-Brücke – insgesamt 58 Tools
Vollständige Design-Automatisierung – Stile, Variablen, Komponenten, Prototypen und Inhalte
Design-Strategien enthalten – read_design_strategy, design_strategy und weitere Prompts integriert

https://github.com/user-attachments/assets/17bda971-0e83-4f18-8758-8ac2b8dcba62

Warum gibt es dieses Projekt?

Die meisten Figma MCP-Server basieren auf der Figma REST-API.

Das klingt gut… bis man auf Folgendes stößt:

Plan	Limit
Starter / View / Collab	6 Tool-Aufrufe/Monat
Pro / Org (Dev-Platz)	200 Tool-Aufrufe/Tag
Enterprise	600 Tool-Aufrufe/Tag

Wenn Sie mit KI-Tools experimentieren, sind diese Limits in wenigen Minuten aufgebraucht.

Ich hatte nicht genug Geld, um für höhere Limits zu bezahlen. Also habe ich etwas gebaut, das die API überhaupt nicht nutzt.

Installation & Einrichtung

Installation via npx – kein Build-Schritt erforderlich. Sehen Sie sich das Einrichtungsvideo an oder folgen Sie den unten stehenden Schritten.

Video ansehen

1. Konfigurieren Sie Ihr KI-Tool

Claude Code CLI

claude mcp add -s project figma-mcp-go -- npx -y @vkhanhqui/figma-mcp-go@latest

.mcp.json (Claude und andere MCP-kompatible Tools)

{
  "mcpServers": {
    "figma-mcp-go": {
      "command": "npx",
      "args": ["-y", "@vkhanhqui/figma-mcp-go"]
    }
  }
}

.vscode/mcp.json (Cursor / VS Code / GitHub Copilot)

{
  "servers": {
    "figma-mcp-go": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@vkhanhqui/figma-mcp-go"
      ]
    }
  }
}

2. Installieren Sie das Figma-Plugin

In Figma Desktop: Plugins → Development → Import plugin from manifest
Wählen Sie manifest.json aus der plugin.zip
Führen Sie das Plugin in einer beliebigen Figma-Datei aus

Verfügbare Tools

Schreiben — Erstellen

Tool	Beschreibung
`create_frame`	Erstellt einen Frame mit optionalem Auto-Layout, Füllung und Parent
`create_rectangle`	Erstellt ein Rechteck mit optionaler Füllung und Eckenradius
`create_ellipse`	Erstellt eine Ellipse oder einen Kreis
`create_text`	Erstellt einen Text-Knoten (Schriftart wird automatisch geladen)
`import_image`	Dekodiert ein Base64-Bild und platziert es als Rechteck-Füllung
`create_component`	Wandelt einen bestehenden FRAME-Knoten in eine wiederverwendbare Komponente um

Schreiben — Ändern

Tool	Beschreibung
`set_text`	Aktualisiert den Textinhalt eines bestehenden TEXT-Knotens
`set_fills`	Setzt eine einfarbige Füllung (Hex) auf einen Knoten
`set_strokes`	Setzt eine einfarbige Kontur und Strichstärke auf einen Knoten
`set_opacity`	Setzt die Deckkraft eines oder mehrerer Knoten (0 = transparent, 1 = undurchsichtig)
`set_corner_radius`	Setzt den Eckenradius – einheitlich oder pro Ecke
`set_auto_layout`	Setzt oder aktualisiert Auto-Layout-Eigenschaften (Flex) auf einem Frame
`move_nodes`	Verschiebt Knoten an eine absolute X/Y-Position
`resize_nodes`	Ändert die Größe von Knoten nach Breite und/oder Höhe
`rename_node`	Benennt einen Knoten um
`clone_node`	Klonen eines Knotens, optional mit Neupositionierung oder neuem Parent

Schreiben — Löschen

Tool	Beschreibung
`delete_nodes`	Löscht einen oder mehrere Knoten dauerhaft

Schreiben — Prototyping

Tool	Beschreibung
`set_reactions`	Setzt Prototyp-Reaktionen (Trigger + Aktionen) auf einen Knoten; Modus `replace` oder `append`
`remove_reactions`	Entfernt alle oder spezifische Reaktionen anhand des nullbasierten Index von einem Knoten

Schreiben — Stile

Tool	Beschreibung
`create_paint_style`	Erstellt einen benannten Paint-Stil mit einer Volltonfarbe
`create_text_style`	Erstellt einen benannten Text-Stil mit Schriftart, Größe und Abstand
`create_effect_style`	Erstellt einen benannten Effekt-Stil (Schlagschatten, Innenschatten, Weichzeichner)
`create_grid_style`	Erstellt einen benannten Layout-Raster-Stil (Spalten, Zeilen oder Raster)
`update_paint_style`	Benennt einen bestehenden Paint-Stil um oder ändert dessen Farbe
`apply_style_to_node`	Wendet einen bestehenden lokalen Stil auf einen Knoten an und verknüpft ihn damit
`delete_style`	Löscht einen beliebigen Stil (Paint, Text, Effekt oder Raster) anhand der ID

Schreiben — Variablen

Tool	Beschreibung
`create_variable_collection`	Erstellt eine neue lokale Variablensammlung mit optionalem Anfangsmodus
`add_variable_mode`	Fügt einer bestehenden Sammlung einen neuen Modus hinzu (z. B. Hell/Dunkel)
`create_variable`	Erstellt eine Variable (COLOR/FLOAT/STRING/BOOLEAN) in einer Sammlung
`set_variable_value`	Setzt den Wert einer Variable für einen bestimmten Modus
`bind_variable_to_node`	Bindet eine lokale Variable an eine Knoteneigenschaft
`delete_variable`	Löscht eine Variable oder eine gesamte Sammlung

Tool	Beschreibung
`navigate_to_page`	Wechselt die aktive Figma-Seite anhand von ID oder Name
`group_nodes`	Gruppiert zwei oder mehr Knoten zu einer GRUPPE
`ungroup_nodes`	Hebt die Gruppierung von GRUPPEN-Knoten auf und verschiebt Kinder zum Parent
`swap_component`	Tauscht die Hauptkomponente eines INSTANCE-Knotens aus
`detach_instance`	Löst Komponenteninstanzen und wandelt sie in einfache Frames um

Lesen — Dokument & Auswahl

Tool	Beschreibung
`get_document`	Vollständiger aktueller Seitenbaum
`get_metadata`	Dateiname, Seiten, aktuelle Seite
`get_pages`	Alle Seiten (IDs + Namen) – leichtgewichtig, kein Laden des Baums
`get_selection`	Aktuell ausgewählte Knoten
`get_node`	Einzelner Knoten anhand der ID
`get_nodes_info`	Mehrere Knoten anhand der ID
`get_design_context`	Tiefenbegrenzter Baum mit `detail`-Ebene (`minimal`/`compact`/`full`)
`search_nodes`	Findet Knoten anhand von Teilstrings im Namen und/oder Typ innerhalb eines Teilbaums
`scan_text_nodes`	Alle Textknoten in einem Teilbaum
`scan_nodes_by_types`	Knoten, die der angegebenen Typenliste entsprechen
`get_viewport`	Aktuelles Viewport-Zentrum, Zoom und sichtbare Grenzen

Lesen — Stile & Variablen

Tool	Beschreibung
`get_styles`	Paint-, Text-, Effekt- und Raster-Stile
`get_variable_defs`	Variablensammlungen und Werte
`get_local_components`	Alle Komponenten + Komponentensets mit Varianten-Eigenschaften
`get_annotations`	Dev-Mode-Anmerkungen
`get_fonts`	Alle auf der aktuellen Seite verwendeten Schriftarten, sortiert nach Häufigkeit
`get_reactions`	Prototyp-/Interaktions-Reaktionen auf einem Knoten

Export

Tool	Beschreibung
`get_screenshot`	Base64-Bildexport eines beliebigen Knotens
`save_screenshots`	Exportiert Bilder auf die Festplatte (serverseitig, kein API-Aufruf)
`export_frames_to_pdf`	Exportiert mehrere Frames als eine einzige mehrseitige PDF-Datei auf die Festplatte
`export_tokens`	Exportiert Design-Tokens (Variablen + Paint-Stile) als JSON oder CSS

MCP-Prompts

Prompt	Beschreibung
`read_design_strategy`	Best Practices für das Lesen von Figma-Designs
`design_strategy`	Best Practices für das Erstellen und Ändern von Designs
`text_replacement_strategy`	Chunk-basierter Ansatz zum Ersetzen von Text in einem gesamten Design
`annotation_conversion_strategy`	Konvertiert manuelle Anmerkungen in native Figma-Anmerkungen
`swap_overrides_instances`	Überträgt Overrides zwischen Komponenteninstanzen
`reaction_to_connector_strategy`	Bildet Prototyp-Reaktionen auf Interaktionsflussdiagramme ab

Mitwirken

Issues und PRs sind willkommen.

figma-mcp-go

figma-mcp-go

Warum gibt es dieses Projekt?

Installation & Einrichtung

1. Konfigurieren Sie Ihr KI-Tool

2. Installieren Sie das Figma-Plugin

Verfügbare Tools

Schreiben — Erstellen

Schreiben — Ändern

Schreiben — Löschen

Schreiben — Prototyping

Schreiben — Stile

Schreiben — Variablen

Schreiben — Komponenten & Navigation

Lesen — Dokument & Auswahl

Lesen — Stile & Variablen

Export

MCP-Prompts

Verwandte Projekte

Mitwirken

Star-Verlauf

Resources

Tools

Latest Blog Posts

MCP directory API