Der Cursor Agent und Composer generieren ganze Features extrem schnell, aber jede Generierung kann neue Styling-Entscheidungen treffen. Ohne ein festes System driften Abstände, Farben und Komponentenformen über verschiedene Dateien hinweg auseinander. Ein Design System gibt dem Agenten einen Satz semantischer Tokens und eine geschriebene DESIGN.md, sodass spätere Komponenten denselben Regeln folgen wie die ersten.

Cursor unterstützt MCP nativ. Der Agent kann Tools nutzen, um während der Arbeit Kits zu suchen, abzurufen und anzuwenden, zusätzlich zum Lesen der Dateien, die das Kit installiert.

Unten siehst du das kostenlose ambient-sage Kit, gerendert aus genau den Tokens, die der Agent in dein Projekt schreibt:

1. 1

   Schreibe die MCP-Konfiguration

   Führe dies in deinem Projektverzeichnis aus, um den Server in die .cursor/mcp.json zu integrieren.

   Copy

   npx --yes identityforge@latest install --client cursor

2. 2

   Aktiviere den Server in Cursor

   Öffne Settings → MCP (oder das MCP Panel) und schalte den identityforge Server ein. Starte Cursor neu, falls die Tools nicht erscheinen.

3. 3

   Anmelden (optional für kostenlose Kits)

   Copy

   npx --yes identityforge@latest login

4. 4

   Fordere den Agenten auf, deine App zu thematisieren

   Gib Produkt, Zielgruppe und Stimmung vor; er erstellt eine Shortlist mit search_themes, liest das Briefing mit get_design_md und wendet es mit apply_theme an.

   Copy

   Use Identity Forge to pick a minimal, warm theme for a
   wellness app, apply it, and follow the DESIGN.md.

{
  "mcpServers": {
    "identityforge": {
      "command": "npx",
      "args": ["-y", "identityforge@latest", "mcp"]
    }
  }
}

Um den Agenten auch außerhalb eines Kit-Anwendungsschritts konsistent zu halten, füge eine kurze Projektregel (.cursor/rules) hinzu. Sage ihm damit, dass er nur anhand der semantischen Tokens stylen und die DESIGN.md befolgen soll. Das ergänzt das Kit perfekt: Die Tokens definieren die Werte, die Regel erzwingt, dass generierter Code diese auch immer nutzt.

Always style against the semantic design tokens defined in the
project (bg-background, text-foreground, bg-primary, bg-muted,
border-border, …) and follow the rules and motifs in DESIGN.md.
Never hardcode raw hex colors or introduce a new font.

1. 1

   CLI Apply

   Schreibt DESIGN.md + eine Tokens-Datei in das aktuelle Verzeichnis; bitte Cursor, diese einzubinden.

   Copy

   identityforge apply ambient-sage

2. 2

   shadcn Registry

   Installiert die CSS-Variablen des Kits direkt, falls du shadcn/ui verwendest.

   Copy

   npx shadcn add https://identityforge.io/r/ambient-sage.json

Siehe das gleiche Setup für Claude Code und Windsurf oder starte mit dem Pillar Guide.