Figma Variables · 8 Sprachen
Verwalten Sie die Texte in Ihren Designs wie Code.
Übersetzen und prüfen Sie die mit Ihren Figma Variables verknüpften Strings Sprache für Sprache. Freigegebene Werte fließen direkt nach Figma und in Ihren Code.
Jede neue Sprache ist ein weiterer Ort, der gepflegt werden muss.
-
Übersetzungen sind verstreut
Figma, Tabellen, Chat. Einen einzigen String zu finden heißt, an drei Orten zu suchen.
-
Unklar, was aktuell ist
Original und Übersetzungen werden zu unterschiedlichen Zeiten bearbeitet. Die Texte in Ihrem Design und in Ihrem Übersetzungsdokument driften unbemerkt auseinander.
-
Aus einer Änderung werden fünf Aufgaben
Ändern Sie eine Zeile im Original, müssen Sie jede Sprache prüfen, sie Screen für Screen übernehmen und erneut an die Entwicklung übergeben.
Design und Übersetzung beginnen mit denselben Daten.
- 01
Übernehmen, wie es ist
Kein neues Übersetzungsdokument nötig. Übernehmen Sie Ihre bestehende Variablenstruktur, Werte und Metadaten – inklusive Scopes und Beschreibungen – genau so, wie sie sind.
- 02
Nebeneinander, nach Sprache
Vergleichen Sie Original und Übersetzung auf einem Bildschirm und fügen Sie die Sprachen hinzu, die Sie brauchen.
- 03
Sichtbarer Status
Wer welchen Wert geändert hat und in welcher Phase jede Übersetzung steht – alles bleibt dokumentiert.
- 04
Nur exportieren, was Sie freigeben
Nur geprüfte Strings gehen zurück nach Figma, exportiert im Format, das Ihre Entwickler brauchen.
- 05
Export in Code
Generieren Sie einfügefertiges CSS, SwiftUI und Jetpack Compose direkt im Web – dazu DTCG, JSON, CSV, eine schreibgeschützte API und einen MCP-Server für KI-Tools. Ihre Tokens, kein Lock-in.
- 06
Ein Token-Set, viele Projekte
Halten Sie Ihr Design System in einem Bibliotheksprojekt. Veröffentlichen Sie eine Änderung, und jedes Produktprojekt prüft sie in seinem Updates-Eingang – und übernimmt nur, was es möchte.
- 07
Jedem Übersetzer seine Sprachen
Fügen Sie beim Anlegen eines Blatts Übersetzer hinzu und wählen Sie, welche Sprachen jeder bearbeitet. Andere Sprachen bleiben als Kontext sichtbar, aber gesperrt. Übersetzer sind immer kostenlos.
Echtzeit-Zusammenarbeit
Sehen Sie, wer gerade welchen String bearbeitet
Werte in Bearbeitung und die Personen daran werden angezeigt. Weniger doppelte Bearbeitung, weniger Nacharbeit an Erledigtem.
- Geteilte Cursor und Cursor-Chat – sprechen Sie direkt dort, wo gearbeitet wird
- Rollenbasierter Zugriff – Designer, Bearbeiter und Übersetzer sehen jeweils den passenden Bereich
- Kommentar-Threads an jeder Zelle – Diskussionen direkt vor Ort klären
Ihre Token-Struktur sehen
Verfolgen, wie weit ein Wert reicht
Sehen Sie referenzierte Variablen und ihre Verbindungen. Bevor Sie eine ändern, sehen Sie, welche Strings und Screens sich mit ihr ändern.
- Referenzen von Primitive → Semantic, visuell angeordnet
- Klicken Sie auf ein Token für „Änderung wirkt sich aus auf: N“ – die Linse zeigt, wie weit eine Änderung reicht, bevor Sie sie vornehmen
- Token Map – das ganze Projekt als Cluster, eingegrenzt per Suche sowie Typ- oder Tag-Filter
- Färben nach „Scopes“ oder „Nicht in Figma“, Tag-Farben als Punkte neben jedem Token – der Token-Status auf einen Blick
KI entwirft, Sie geben frei
Übersetzen, prüfen, bestätigen
Die KI entwirft Übersetzungen; Menschen vergleichen sie mit dem Original und verfeinern sie. Nur geprüfte Strings werden bestätigt.
- KI-Erstentwürfe, die Sie übernehmen, bearbeiten oder ablehnen
- Ein Glossar, das sich Ihre Korrekturen für das nächste Mal merkt
- Prüfen und genehmigen, bevor etwas in Ihre Datei gelangt
Für die Übergabe an die Entwicklung gebaut
Design und Code nutzen dieselben Texte
Exportieren Sie freigegebene Werte als DTCG, JSON oder CSV – oder generieren Sie sie als CSS, SwiftUI und Jetpack Compose. Design und Entwicklung verwenden keine unterschiedlichen Übersetzungen mehr.
- CSS, SwiftUI und Jetpack Compose – deterministisch, bereit zum Einfügen
- Holen Sie die neuesten Tokens über eine schreibgeschützte API in Ihre CI-Pipeline
- Ein MCP-Server, über den KI-Coding-Tools Tokens als Code abrufen
Struktur ändern, Verknüpfungen behalten
Variablen umbenennen, verschieben – die Verknüpfungen bleiben
Benennen Sie eine Variable, Gruppe oder Sammlung um, und jeder Alias, der darauf verweist, wird im ganzen Projekt aktualisiert. Aufräumen bricht keine Referenzen und keine Figma-Verknüpfungen mehr.
- Umbenennen – ob Variable, Gruppe oder Sammlung, jeder Alias, der darauf verweist, folgt automatisch
- In Sammlung verschieben – bei unveröffentlichten Sammlungen werden die Figma-Ebenen der Datei bei der nächsten Synchronisierung mit der verschobenen Variable neu verknüpft
- Referenzierte Variable löschen – wie in Figma behalten Verweise ihren letzten Wert, und es lässt sich rückgängig machen · zirkuläre Referenzen werden von vornherein blockiert
Drei Schritte genügen.
- 1
Figma verbinden
Verbinden Sie eine Figma-Datei, und die verwendeten Variablen und Werte werden übernommen.
- 2
Übersetzen und prüfen
Fügen Sie die zu verwaltenden Sprachen hinzu und übersetzen Sie sie. Bestätigen Sie nach dem Abgleich mit dem Original.
- 3
Nach Figma und in den Code
Übernehmen Sie bestätigte Werte in Figma und exportieren Sie sie in einem Format, das Ihre Entwicklungsumgebung nutzen kann.
Wichtiger als die Tokens ist, wie sie sich ändern.
Ein String ist kein Wert, den man einmal einträgt und dann vergisst. Ändert sich das Original, muss die Übersetzung erneut geprüft werden; bestätigte Inhalte müssen sowohl das Design als auch den Code erreichen. variable Jar verbindet diesen Prozess nachvollziehbar – wer bearbeitet hat, welche Sprachen die Prüfung bestanden haben, auf welche Eigenschaften er zielt und wo er zuletzt übernommen wurde.
- Übersetzungs-Workflow eingebaut – nicht nachträglich angeflanscht
- Ein Glossar, das die Sprache Ihres Produkts lernt
- Übersetzer arbeiten kostenlos mit – mit vollem Kontext
- Eine Synchronisierung, die Scopes und Beschreibungen hin und zurück überträgt – nicht nur Werte
- Eine Synchronisierung, die nie stillschweigend überschreibt – Konflikte halten an, und Sie wählen Zeile für Zeile
Einfache Preise
Free
$0
Übersetzen, prüfen und mit Figma synchronisieren – kostenlos
Pro
$19 /Platz/Monat
Unbegrenzte Projekte + 30.000 KI-Übersetzungszellen pro Monat + Teamarbeit
Größeres Team? Kontakt aufnehmen
Fragen und Antworten
Welche Figma Variables kann ich übernehmen?
Alle vier Typen – String, Farbe, Zahl und Boolean. Aliase (Referenzen) und Modi werden unverändert übernommen, sodass Sie Farb- und Abstands-Tokens zusammen mit mehrsprachigen Texten in einem Projekt verwalten.
Muss ich meine bestehende Variablenstruktur ändern?
Nein. Ihre aktuelle Struktur und Ihre Werte werden unverändert übernommen. Es gibt keine Namensregeln – durch '/' im Namen getrennte Gruppen werden genau so gelesen, wie sie sind.
Muss ich die KI-Übersetzung nutzen?
Nein. Sie können Übersetzungen selbst eingeben und bearbeiten. Die KI-Übersetzung liefert nur einen Ausgangspunkt – Prüfung und Bestätigung liegen immer bei Ihnen.
Woran erkenne ich, dass sich das Original geändert hat?
Wird das Original bearbeitet, werden die Sprachen markiert, die erneut geprüft werden müssen. Prüfen Sie die Änderung, überarbeiten Sie die Übersetzung und bestätigen Sie erneut.
Können mehrere Personen zusammenarbeiten?
Ja. Laden Sie Ihr Team in Ihren Workspace ein, um laufende Werte, die Beteiligten und den Übersetzungsstatus gemeinsam zu sehen. Es gibt vier Rollen – Eigentümer, Teammitglied, Bearbeiter und Übersetzer – und Übersetzerplätze sind kostenlos.
Wie funktioniert es in einer Entwicklungsumgebung?
Exportieren Sie bestätigte Werte als DTCG, JSON oder CSV oder generieren Sie einfügefertigen CSS-, SwiftUI- und Jetpack-Compose-Code. Über eine schreibgeschützte API und einen MCP-Server können Sie die neuesten Tokens auch direkt abrufen.
Kann ich direkt in Figma übernehmen?
Ja. Der einzige Button „Synchronisieren“ im Plugin sendet die Variablen der Datei an die Web-App und überträgt Änderungen aus der Web-App zurück in die Datei. Haben beide Seiten dieselbe Variable geändert, entscheiden Sie im Web-Raster Zeile für Zeile, welche Seite bleibt.
Verliert eine Variable ihre Figma-Verknüpfung, wenn ich sie umbenenne oder in eine andere Sammlung verschiebe?
Nein. Eine Umbenennung kommt in Figma als Umbenennung an, sodass Ebenenbindungen erhalten bleiben. Bei einer in eine andere Sammlung verschobenen Variable werden ihre Ebenen in der Datei bei der nächsten Synchronisierung neu verknüpft; was sich nicht neu verknüpfen lässt, wird in der Zeile markiert. Ist eine der beiden Sammlungen eine veröffentlichte Bibliothek, wird die Verschiebung abgelehnt statt übernommen. Aliase, die darauf verweisen, folgen automatisch dem neuen Namen.
Beginnen Sie mit den Figma Variables, die Sie schon nutzen.
Bevor Sie ein neues Übersetzungsdokument anlegen, verbinden Sie zuerst die Texte in Ihrem Design. Übersetzung, Prüfung und Übernahme nach Figma und in den Code folgen in einem Ablauf.
variable Jar ist eine Web-App und ein Figma-Plugin für die Texte in Ihren Figma Variables: Übersetzen und prüfen Sie sie im Web, synchronisieren Sie sie zurück nach Figma und exportieren Sie sie als Code. Wenn Sie sich mit Google anmelden, erhalten wir nur Ihren Namen, Ihre E-Mail-Adresse und Ihr Profilbild, um Ihr Konto anzulegen. Datenschutzerklärung