CopilotKit
CopilotKit · Coding · Chatbot
CopilotKit ist ein Framework für KI-Copiloten, quelloffen, das KI-Agenten in Ihr Produkt einbaut: Chat, Aktionen und generative Oberflächen für React, Angular und Mobile-Apps.
Über CopilotKit
About
Was ist CopilotKit
CopilotKit ist ein Entwickler-Framework, das die Oberfläche Ihrer Anwendung mit einem KI-Agenten verbindet. Statt Chatfenster, Streaming und Tool-Aufrufe von Hand zu bauen, setzen Sie einen Provider und eine Chat-Komponente ins Projekt und überlassen dem Framework die Leitungen. Das Projekt begann als React-Bibliothek und deckt heute React, Angular, Vue, React Native und iOS ab, dazu Slack, Teams und WhatsApp.
Den Open-Source-Copilot schließt es an der letzten Lücke an. Viele Teams haben einen funktionierenden Agenten im Backend und keinen ordentlichen Weg, seine Arbeit im Produkt zu zeigen. CopilotKit liefert fertige Chat-Oberflächen, Hooks, die den App-Zustand an den Agenten geben, und eine Registrierung für Aktionen, die er aufrufen darf. So sortiert der Copilot eine Tabelle, öffnet einen Datensatz oder füllt ein Formular auf dem Bildschirm, den der Nutzer gerade sieht.
Das Unternehmen pflegt außerdem AG-UI, ein offenes, ereignisbasiertes Protokoll für die Verbindung zwischen Agenten-Backend und Frontend. Das zählt, wenn Sie später das Agenten-Framework tauschen wollen, ohne die Oberfläche neu zu bauen. Das SDK steht unter MIT-Lizenz. Die gehostete Laufzeit CopilotKit Intelligence ist ein Bezahlprodukt und rechnet Threads, Speicher und Slack-Guthaben ab.
Der CopilotKit Preis hat drei Grenzen, die Sie vor dem Start prüfen sollten. Das Framework setzt eine programmierte Anwendung voraus, No-Code-Werkzeuge helfen hier nicht. Die kostenlose gehostete Stufe endet bei 200 Threads und drei Tagen Aufbewahrung. Automatisches Lernen und Analytik sind als Early Access gekennzeichnet, also noch in Bewegung.
Erste Schritte
- Installieren Sie das SDK in einem bestehenden Projekt oder starten Sie mit den offiziellen Vorlagen für React, Angular, Vue oder React Native.
- Legen Sie den CopilotKit-Provider um Ihre App und richten Sie ihn auf einen Agenten-Endpunkt oder die verwaltete Laufzeit.
- Bestimmen Sie mit Lese-Hooks, was der Agent sehen darf, und mit Action-Hooks, was er ausführen darf.
- Wählen Sie die Oberfläche: Seitenleiste, Popup oder eine vollständig headless Variante an Ihrem Designsystem.
- Setzen Sie für jede Aktion mit Geld, Daten oder Berechtigungen eine Bestätigung durch einen Menschen davor und testen Sie mit echten Abläufen.
Produktinformationen
Ein kurzer Überblick über Preise, unterstützte Plattformen und die Leistung von CopilotKit.
Am besten für
Die Nutzer, Aufgaben und Szenarien, für die dieses Tool am besten passt.
Nutzer
- Frontend-Entwickler, die einen Produkt-Copiloten ausliefern
- Produktteams in SaaS-Firmen
- Plattform-Teams mit mehreren Agenten-Backends
- Support- und Operations-Bereiche mit internen Werkzeugen
Aufgaben
- Chat in die App holen
- Den Agenten auf der Seite handeln lassen
- Interaktive Antworten rendern
- Freigaben einbauen
- Einen Slack- oder Teams-Assistenten bauen
Szenarien
- Ein Dashboard, das Fragen zu den sichtbaren Daten beantwortet
- Eine Support-Konsole mit Übergabe
- Ein Finanz- oder Verwaltungswerkzeug, in dem Fehler teuer sind
- Ein schneller Prototyp für eine neue Agenten-Idee
Wichtigste Funktionen
Chat-Komponenten
Die Bibliothek bringt fertige Chat-Oberflächen mit: vollständiges Panel, Seitenleiste und Popup. Alle streamen Antworten und unterstützen generative UI ohne Zusatzarbeit. Einzelne Teilstücke wie die Nachrichtenblase oder das Eingabefeld tauschen Sie über Slots aus, sodass der Copilot das Erscheinungsbild Ihres Produkts übernimmt. Wer volle Kontrolle will, nutzt dasselbe Verhalten als headless Hooks.
Generative UI
Der Agent antwortet mit echten Bedienelementen statt mit Prosa. CopilotKit kennt drei Muster: einen kontrollierten Modus, in dem Sie die Komponenten vorgeben und der Agent eine auswählt und mit Daten füllt, einen deklarativen Modus, in dem der Agent einen UI-Baum vorschlägt und die App ihn prüft, und einen offenen Modus für reichere Ausgaben. In der Praxis kommt auf die Frage nach Ausgaben je Lieferant ein Diagramm im eigenen Stil zurück, auf eine Erstattungsanfrage ein Formular, das der Nutzer abschickt.
Aktionen in der App und gemeinsamer Zustand
Mit den Hooks geben Sie den App-Zustand an den Agenten und registrieren Funktionen, die er aufrufen kann. Der Agent sieht die aktuelle Tabelle, den markierten Datensatz oder das offene Formular und macht dann einen Schritt: eine Spalte sortieren, eine Detailseite öffnen. Zustandsänderungen laufen in die App zurück, das Handeln des Agenten bleibt also sichtbar und umkehrbar statt im Chatverlauf zu verschwinden.
Freigabe durch Menschen
Jede Aktion mit Geld, Berechtigungen oder Kundendaten kann vor der Ausführung eine Bestätigung verlangen. Die Anfrage erscheint mit den konkreten Parametern im Gespräch, der Nutzer gibt sie dort frei oder lehnt ab. Erst dadurch lässt sich ein agentengestütztes Produkt in regulierten, kundennahen Abläufen vertreten, in denen eine ungeprüfte Ausführung nicht infrage kommt.
AG-UI-Protokoll und KI-Agent in der App
AG-UI ist ein offenes, ereignisbasiertes Protokoll, das den Dialog zwischen Agenten-Backend und Frontend vereinheitlicht. CopilotKit pflegt es und liefert Verbindungen für LangGraph, CrewAI, Mastra, Google ADK, AWS Strands, das OpenAI Agents SDK und das Claude Agent SDK, rund zwanzig weitere stehen bereit. Weil das Protokoll getrennt vom SDK lebt, wechseln Sie das Agenten-Framework später und behalten den Frontend-Code.
Selbsthosting und CopilotKit Intelligence
Das Frontend-SDK läuft unter MIT-Lizenz, die Laufzeit lässt sich selbst hosten, damit Daten in Ihrer Infrastruktur bleiben, auch vor Ort oder in einer VPC. Die verwaltete Variante CopilotKit Intelligence ergänzt Thread-Speicher, Hosting, Slack- und Teams-Kanäle, einen Inspector zum Nachvollziehen von Läufen und Analytik. Bezahlte Pläne heben die Grenzen für Aufbewahrung und Speicher an.
Vor- und Nachteile
Vorteile
- Das offene SDK nimmt die Routinearbeit für Streaming, Tool-Aufrufe und Kontext-Verdrahtung ab.
- AG-UI hält das Frontend unabhängig vom Agenten-Framework, was einen späteren Wechsel verbilligt.
- Fertige Komponenten decken Seitenleiste, Popup und headless Varianten ab, das eigene Designsystem bleibt erhalten.
- Freigaben durch Menschen machen Agenten-Aktionen prüfbar, was in Finanz- und Kundenservice-Abläufen zählt.
- Die kostenlose Stufe erlaubt 200 Threads und eine Slack- oder Teams-Organisation, genug für die ersten Prototypen.
Nachteile
- Es ist ein Werkzeug für Entwickler, Marketingteams oder Gründer ohne Frontend-Kenntnisse kommen nicht direkt damit weiter.
- Die kostenlose Stufe hält Threads drei Tage und begrenzt den Speicher auf 1 GB, für Tests mit echten Nutzern zu knapp.
- Automatisches Lernen, Analytik und mehrere Enterprise-Funktionen sind Early Access, ihr Verhalten kann sich ändern.
- Dokumentation und API-Namen haben sich über Hauptversionen verschoben, ältere Anleitungen führen bei der Einrichtung in die Irre.
Häufige Fragen
Es bringt einen KI-Assistenten in eine Anwendung, die Sie ohnehin bauen: Chat-Panel, Agenten-Aktionen direkt auf der Seite und erzeugte Bedienelemente wie Diagramme oder Formulare. Entwickler sorgen damit dafür, dass der Agent auf den echten App-Zustand zugreift, statt in einem eigenen Fenster zu antworten.
Ähnliche Inhalte
Entdecke passende Tools, Skills und Artikel zu CopilotKit.
Alternativen zu CopilotKit
Udon
Udon · Coding · ProduktivitätUdon macht aus einem Apple-Silicon-Mac einen Heimserver, den Sie im Browser steuern, mit Containern, Dateifreigaben und einem optionalen KI-Systemadministrator.
offstage
offstage cloud · Coding · Produktivitätoffstage gibt KI-Agenten und CI-Jobs einen echten Mac: ein frisches macOS-27-Konto auf Apple Silicon, per API gesteuert und sekundengenau abgerechnet.
BotBus
Chengdu Tuyang Tusen Technology Co., Ltd. · Coding · ProduktivitätMit BotBus lassen sich KI-Agenten vom Smartphone steuern, auch wenn der Rechner im Büro steht: Befehle freigeben, Aufgaben starten, Ergebnisse lesen.