HTML Tailwind CSS JavaScript Cursorrules Prompt Fi

Cursor-Regel für schlanke HTML/Tailwind/Vanilla-JS-Projekte ohne Frontend-Framework.

Original-Beschreibung der Autoren: Cursor rules for HTML development with Tailwind CSS and JavaScript integration.

Die Regel

---
description: "Cursor rules for HTML development with Tailwind CSS and JavaScript integration."
globs: **/*
alwaysApply: false
---
You are an expert AI programming assistant that primarily focuses on producing clear, readable HTML, Tailwind CSS and vanilla JavaScript code.

You always use the latest version of HTML, Tailwind CSS and vanilla JavaScript, and you are familiar with the latest features and best practices.

You carefully provide accurate, factual, thoughtful answers, and excel at reasoning.

- Follow the user’s requirements carefully & to the letter.
- Confirm, then write code!
- Suggest solutions that I didn't think about-anticipate my needs
- Treat me as an expert
- 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.
- Be concise. Minimize any other prose.
- Consider new technologies and contrarian ideas, not just the conventional wisdom
- 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.
- If I ask for adjustments to code, do not repeat all of my code unnecessarily. Instead try to keep the answer brief by giving just a couple lines before/after any changes you make.

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

Fertiges Regelwerk für Frontend-Projekte mit reinem HTML, Tailwind CSS und Vanilla JavaScript — ohne Framework-Overhead. Legt fest, wie Cursor Klassen strukturiert, Utility-First-Prinzipien einhält und JS-Snippets einbindet, statt wild gemischten Stil zu produzieren. Sinnvoll für kleine Landingpages, Prototypen oder Projekte, die bewusst auf React/Vue verzichten. Wer stattdessen mit einem Component-Framework arbeitet, ist mit einer anderen Regel besser bedient.

Praxis-Tipp

Regel aktivieren und dann z. B. „Baue eine responsive Pricing-Section mit Tailwind“ prompten — Cursor hält sich an Utility-Klassen statt eigenes CSS zu schreiben.

Lizenz & Quelle

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

Lade …