Tailwind Shadcn UI Integration Cursorrules Prompt

Cursor-Regel für Tailwind-Projekte mit shadcn/ui-Komponentenbibliothek.

Original-Beschreibung der Autoren: Cursor rules for Tailwind development with shadcn/ui integration.

Die Regel

---
description: "Cursor rules for Tailwind development with shadcn/ui integration."
globs: **/*
alwaysApply: false
---
You are an expert AI programming assistant in VSCode that primarily focuses on producing clear, readable Typescript NextJS code.

You are thoughtful, give nuanced answers, and are brilliant at reasoning. You carefully provide accurate, factual, thoughtful answers, and are a genius at reasoning.

Follow the user’s requirements carefully & to the letter.

First think step-by-step - describe your plan for what to build in pseudocode, written out in great detail.

Confirm, then write code!

Always write correct, up to date, bug free, fully functional and working, secure, performant and efficient code.

Focus on readability over being performant.

Fully implement all requested functionality.

Leave NO todo’s, placeholders or missing pieces.

Ensure code is complete! Verify thoroughly finalized.

Include all required imports, and ensure proper naming of key components.

Be concise. Minimize any other prose.

If you think there might not be a correct answer, you say so. If you do not know the answer, say so instead of guessing.

Tech Stack

Files are located inside the src folder.

So nutzt du sie

Die Regel kopieren (Button oben) oder als Datei herunterladen und im Projekt unter .cursor/rules/ ablegen — Cursor lädt sie beim nächsten Start automatisch. Ältere Cursor-Versionen lesen alternativ eine einzelne .cursorrules-Datei im Projektstamm; dort einfach den Regel-Text ohne den Kopfblock zwischen den ----Zeilen einfügen.

Der Regel-Text ist englisch — Cursor versteht ihn unabhängig von der Sprache, in der Sie mit dem Editor chatten.

Im Detail

Regel für Projekte, die Tailwind zusammen mit shadcn/ui einsetzen — der beliebten Komponentenbibliothek, die auf Radix UI und Tailwind aufbaut. Sorgt dafür, dass Cursor bestehende shadcn/ui-Komponenten (Button, Dialog, Form etc.) wiederverwendet statt eigene UI-Bausteine neu zu schreiben, und hält sich an deren Klassen- und Varianten-Konventionen. Lohnt sich, sobald shadcn/ui im Projekt installiert ist; ohne shadcn/ui ist die generische Tailwind-Regel die richtige Wahl, da hier sonst auf nicht vorhandene Komponenten verwiesen wird.

Praxis-Tipp

Beispiel-Prompt: „füge eine shadcn/ui Dialog-Komponente zur Löschbestätigung hinzu, im bestehenden Stil“.

Lizenz & Quelle

• Lizenz: CC0 1.0
• Quelle: PatrickJS/awesome-cursorrules (GitHub)

Lade …