tailwind.mdc

Tailwind-CSS- und UI-Komponenten-Konventionen

Für wen: Frontend mit Utility-CSS

So nutzt du es

Datei in deinem Projekt unter .cursor/rules/ ablegen (modernes .mdc-Format) oder den Inhalt in den Cursor-Einstellungen unter Rules einfügen. Cursor hält sich ab dann in diesem Projekt an die Regeln — z. B. Stack-Konventionen und Code-Stil.

Im Detail

Legt fest, wie Utility-Klassen angeordnet, Komponenten strukturiert und wiederkehrende UI-Muster wie Buttons, Cards oder Formulare mit Tailwind CSS umgesetzt werden sollen. Ziel ist, dass ein KI-Assistent nicht bei jedem Prompt neue Klassenkombinationen erfindet, sondern sich an ein Projektschema hält — etwa konsistente Spacing-Skalen oder eine feste Reihenfolge von Utility-Klassen. Nützlich für Frontend-Teams mit Tailwind-lastigem Code, die Wildwuchs in Klassenlisten vermeiden wollen. Ersetzt keine Design-System-Dokumentation, ergänzt sie aber für den täglichen KI-gestützten Editier-Workflow.

Praxis-Tipp

Kombinieren Sie sie mit einer kurzen Liste erlaubter Farb- und Spacing-Tokens im Prompt, damit der Assistent keine willkürlichen Werte erfindet.

Siehe auch

• nextjs-app-router-…
• react.mdc
• typescript.mdc

Lizenz & Quelle

• Lizenz: CC0-1.0
• Quelle: github.com/PatrickJS/awesome-cursorrules

Lade …