Home › All rules › Community › Html Tailwind Css JavaScript Cursor Rules

Html Tailwind Css JavaScript Cursor Rules

Cursor rules for HTML development with Tailwind CSS and JavaScript integration.

CursorTailwind CSSCommunity (CC0)

How to use

Save this as .cursor/rules/html-tailwind-css-javascript-cursorrules-prompt-fi.mdc in your project, commit it, and Cursor will load it. Review it first: community files can be opinionated or out of date.

Note: Review and test before use. Provided as is, without warranty. See Terms.

.cursor/rules/html-tailwind-css-javascript-cursorrules-prompt-fi.mdcDownload  
---
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.

More: Tailwind CSS rules · all community rules

Related rules

Tailwind CSS .claude/rules file

A path-scoped Claude Code rules file (.claude/rules) for Tailwind v4 styling in component files.

Claude Code (CLAUDE.md)Tailwind CSS

Tailwind CSS v4 rules

Cursor rules for Tailwind CSS v4: CSS-first config with @theme, @utility and @custom-variant, the Vite plugin, and tokens.

CursorTailwind CSS

Tailwind CSS v4 rules

Windsurf rules for clean, consistent, accessible Tailwind CSS v4 styling.

WindsurfTailwind CSS

Tailwind Shadcn Ui Integration Cursor Rules

Cursor rules for Tailwind development with shadcn/ui integration.

CursorTailwind CSSCommunity (CC0)

Tailwind Cursor Rules

Tailwind CSS and UI component best practices for modern web applications

CursorTailwind CSSCommunity (CC0)

TypeScript Vite Tailwind Cursor Rules

Cursor rules for TypeScript development with Vite and Tailwind integration.

CursorTailwind CSSCommunity (CC0)

Get new rules weekly

One email a week: fresh rule files, agent tips, and what's changing in Cursor, Claude Code and Copilot. Free, unsubscribe anytime.

Opens the Rulestack Newsletter on beehiiv in a new tab. Or subscribe directly on beehiiv.