# shadcn MCP Server

Offizieller MCP-Server, der es KI-Assistenten ermöglicht, shadcn/ui-Komponenten direkt aus Registries per natürlicher Sprache zu durchsuchen, zu finden und zu installieren – für halluzinationsfreie, KI-gestützte UI-Entwicklung.

Canonical URL: https://a2a-mcp.org/entry/shadcn-mcp-server-de

Language: de

Category: MCP Servers

Updated: 2026-03-18

## Überblick

Der shadcn MCP Server ist die offizielle Implementierung des [Model Context Protocol (MCP)](https://modelcontextprotocol.io) für shadcn/ui. Er ermöglicht es KI-Assistenten und Agenten, sich sicher mit shadcn-kompatiblen Komponenten-Registries zu verbinden, verfügbare Komponenten zu durchsuchen, gezielt zu suchen, Quellcode, Demos und Metadaten abzurufen und diese sogar per natürlicher Sprache direkt in Projekte zu installieren.

Dies beseitigt typische KI-Probleme wie veraltetes Wissen oder halluzinierte Props, indem es strukturierten Echtzeitzugriff auf die neuesten Registry-Daten bietet und sich mit der shadcn CLI integriert.

## Funktionen

- **Registries durchsuchen & durchsuchen**: Die KI kann Komponenten, Blöcke und Charts aus jeder shadcn-kompatiblen Registry auflisten und abfragen.
- **Präzise Daten abrufen**: Zugriff auf aktuellen TypeScript-Quellcode, Props/Interfaces, Anwendungsbeispiele und Installationsbefehle.
- **Direkte Installation**: Die KI kann über die integrierte CLI-Bridge automatisch `shadcn add`-Befehle ausführen.
- **Framework-unabhängige Registries**: Funktioniert mit jeder shadcn-Registry (offiziell oder benutzerdefiniert), einschließlich React- und Tailwind-basierter Komponenten.
- **Sichere lokale Ausführung**: Läuft als lokaler Server (meist über npx oder ein installiertes Paket) mit konfigurierbarer Authentifizierung.
- **IDE- & Tool-Integration**: Native Unterstützung in Tools wie Cursor, Claude Desktop, Zed und anderen MCP-fähigen Anwendungen.

## Funktionsweise

1. Installieren Sie den MCP-Server (in der Regel über npx oder die Projektkonfiguration).
2. Konfigurieren Sie Ihre Registry in `components.json`.
3. Verbinden Sie Ihren KI-Assistenten mit dem lokalen MCP-Endpunkt.
4. Verwenden Sie natürliche Sprachbefehle wie „füge ein schönes Dashboard mit shadcn-Charts hinzu“ — die KI durchsucht die Registry, wählt Komponenten aus und installiert sie.

## Anwendungsfälle

- KI-gestütztes UI-Prototyping in Cursor oder Claude Code.
- Automatisierung der Komponenteninstallation in großen Codebasen.
- Aufbau von Multi-Agenten-Workflows, bei denen ein Agent Komponenten recherchiert und ein anderer die UI zusammensetzt.
- Integration benutzerdefinierter Registries für Enterprise-Designsysteme.

## Erste Schritte

Siehe die offizielle Dokumentation: https://ui.shadcn.com/docs/mcp

Typischer Start:
```bash
npx shadcn@latest mcp
```
oder durch Konfiguration im Projekt und Nutzung mit kompatiblen KI-Tools.

Es existieren viele Community-Forks und erweiterte Versionen (z. B. mit Multi-Framework-Unterstützung für Svelte/Vue), aber die offizielle Version von shadcn/ui wird für die meisten Nutzer empfohlen.

## Tags

- shadcn
- mcp
- ai-agent
- ui-components
- registry
- typescript
- react
- tailwind
- claude
- cursor

## Sources

- [Project website](https://ui.shadcn.com/docs/mcp)