Communitygithub.com

samhvw8/ui-design-system

React-UI-Komponentensysteme mit TailwindCSS + Radix + shadcn/ui.

Was ist ui-design-system?

Diese Skill unterstützt Entwickler bei der Erstellung und Verwaltung von React-basierten UI-Komponentensystemen unter Verwendung von TailwindCSS, Radix UI und shadcn/ui. Sie ist ideal für die Arbeit mit Designsystemen, zugänglichen Komponenten, responsiven Layouts, Theming und Dark Mode. Die Skill kann Komponenten überprüfen, entwerfen, erstellen, verbessern und umgestalten. Sie ist für React- und Next.js-Projekte optimiert und nutzt Design-Tokens, CSS-Variablen und komponentenbasierte Architektur, um skalierbare und barrierefreie Benutzeroberflächen zu gewährleisten.

Funktioniert mit~Claude Code~Codex CLI~Cursor
Part ofDesign & UI
npx skills add https://github.com/samhvw8/dot-claude/tree/main/skills/ui-design-system
Original anzeigen→Alle Skills durchsuchen

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

OpenAIChatGPTClaudeClaudeGeminiGeminiGrokGrokPerplexityPerplexityDeepSeekDeepSeek

Dokumentation

Was macht ui-design-system?

React-UI-Komponentensysteme mit TailwindCSS + Radix + shadcn/ui. Stack: TailwindCSS (Styling), Radix UI (Primitive), shadcn/ui (Komponenten), React/Next.js. Fähigkeiten: Designsystem-Architektur, barrierefreie Komponenten, responsive Layouts, Theming, Dark Mode, Komponentenkomposition. Aktionen: Überprüfen, Entwerfen, Erstellen, Verbessern, Umgestalten von UI-Komponenten. Schlüsselwörter: TailwindCSS, Radix UI, shadcn/ui, Designsystem, Komponentenbibliothek, Barrierefreiheit, ARIA, responsiv, Dark Mode, Theming, CSS-Variablen, Komponentenarchitektur, Atomic Design, Design-Tokens, Variante, Slot, Komposition. Verwende wenn: Erstellen von Komponentenbibliotheken, Implementieren von shadcn/ui, Erstellen barrierefreier Oberflächen, Einrichten von Designsystemen, Hinzufügen von Dark Mode/Theming, Überprüfen der UI-Komponentenarchitektur.

Verwandte Skills

steipete/sag

ElevenLabs text-to-speech with mac-style say UX.

community

steipete/oracle

Oracle CLI second-model review/debug/refactor/design with selected files, dry-run token checks, API or browser engine.

community

steipete/peekaboo

Capture and automate macOS UI with the Peekaboo CLI.

community

mattpocock/design-an-interface

Generate multiple radically different interface designs for a module using parallel sub-agents. Use when user wants to design an API, explore interface options, compare module shapes, or mentions "design it twice".

community

mattpocock/prototype

Build a throwaway prototype to flesh out a design — a runnable terminal app for state/business-logic questions, or several radically different UI variations toggleable from one route.

community

mattpocock/grill-me

Interview the user relentlessly about a plan or design until reaching shared understanding, resolving each branch of the decision tree. Use when user wants to stress-test a plan, get grilled on their design, or mentions "grill me".

community