Figma-Variablen definieren die gemeinsamen Gestaltungswerte. Die Token-Namen folgen der Tailwind-Systematik und sind damit auf den Export ausgerichtet. Darauf baut eine Komponentenbibliothek auf, die Grundelemente und zusammengesetzte Bausteine konsistent abbildet.
Light- und Dark-Mode sind im Demo-Theme bereits umgesetzt. Die Variablenstruktur lässt sich um weitere Modes ergänzen, etwa für breite oder schmale Layouts mit Wide und Narrow oder für eine High-Contrast-Darstellung. Diese Varianten können auf derselben Systembasis aufbauen, ohne ein separates Designsystem anzulegen.
Der bestehende ICMS-Komponentenumfang bildete die Grundlage für die Bibliothek. Das Framework des Agenturpartners nutzt die Figma-Variablen und Komponentendetails, um die Gestaltung standardisiert in Code zu übertragen. Unser Beitrag war die Figma-Seite dieser Verbindung: ein Theme und ein System, deren Struktur zum Page-Builder passt.
TokenLab-Support und -Integration ergänzen diese Grundlage für die Token-Exporte. Mit TokenLab lassen sich Export-Pipelines, Transformationen und Zielformate auf die Anforderungen der Entwicklung abstimmen. So können die Tokens in der Form bereitgestellt werden, die das jeweilige Framework und der weitere Workflow benötigen.