Zum Inhalt springen
MCP Server

Die Library in deinem Editor.

Kein Suchen, kein Copy-Paste. Der Assistent schreibt die perfekten Tailwind-Komponenten direkt in dein Projekt.

In drei Schritten

So richtest du es ein

Eine Hand tippt auf einem hell beleuchteten Laptop.1

Verbinden

MCP-URL einmalig im Editor eintragen. Kein Login, kein SDK.

Jemand arbeitet am Rechner, das Licht zieht Spuren.2

Anfragen

Im Chat beschreiben, was du brauchst. Der Assistent findet die passende Komponente.

Mehrere Oberflächen legen sich über dem Bildschirm übereinander.3

Einbauen

Der fertige Code landet in deinem Projekt, samt Animationen.

Zugang

Ohne Konto und mit Premium

Kostenlos testen

Trag die URL ein und leg los. Kein Login, kein SDK, kein Key.

  • Alle kostenlosen Sections und Elemente
  • Suche im Katalog, Vorschau und Metadaten
  • Kein Konto, kein Key, keine Installation
https://systra.tools/api/mcp

Premium aktivieren

Mit dem persönlichen Key liefert der Server den vollständigen Code.

  • Der vollständige Quellcode aller Komponenten
  • Alle Templates und die Bilder der Ressourcen
  • Persönlicher Key, jederzeit erneuerbar
  1. 1Konto anlegen oder anmelden. Nutze dieselbe E-Mail-Adresse wie beim Kauf.
  2. 2Lifetime oder ein Abo kaufen. Die Zahlung läuft über Lemon Squeezy.
  3. 3Die Freischaltung kommt automatisch zurück, dazu eine E-Mail mit Anmeldelink.
  4. 4Hier auf dieser Seite den persönlichen Key erzeugen.
  5. 5Key als Authorization-Header in die Konfiguration deines Editors eintragen.
Setup

Für deinen Editor

Der Key wandert als Authorization-Header mit, nie als Teil der URL. Ohne Key funktioniert dieselbe Konfiguration, dann liefert der Server nur die kostenlosen Inhalte. Der Server spricht das offene MCP-Protokoll über HTTP, jeder Editor mit MCP-Unterstützung kann sich verbinden.

Claude Code

Terminal

Im Projektordner ausführen. Der Key wird als Header mitgegeben.

claude mcp add --transport http systra https://systra.tools/api/mcp \
  --header "Authorization: Bearer systra_DEIN_KEY"
Der Assistent

Was der Assistent kann

Hero mit Vollbild-Foto
GiantWordmarkHeroHero
ContactSplitPanelKontakt
PricingScaleCardsPricing
Premium Zugang

Dein Schlüssel zur ganzen Library

Um den MCP Server in vollem Umfang für alle Komponenten der Library nutzen zu können, benötigst du einen persönlichen API-Key aus deinem Premium-Konto.

Wenn etwas klemmt

Fehlermeldungen im Editor

Ein gläsernes Fragezeichen auf dunklem Grund

Meist ist es der Key.

Bleibt es dabei, schreib uns kurz. Nenn den Editor und die genaue Meldung, dann geht es schneller.

Problem melden
FAQ

Häufige Fragen

Über das Model Context Protocol verbindest du deinen KI-Editor direkt mit der Library. Dein Assistent kann Komponenten durchsuchen und den Quellcode ohne manuelles Kopieren einfügen.

Deine Frage war nicht dabei? Wir helfen gern weiter.

Kontakt aufnehmen