tailwindcss

Tailwind CSS Component Development

Cursor rules for building reusable UI components with Tailwind CSS and utility-first design patterns.

Covers

• Utility class ordering and organization
• Responsive design (mobile-first, breakpoints)
• Color system and dark mode
• Typography scale and prose content
• Interactive states (hover, focus, active, disabled)
• Component patterns (Button, Card, Input recipes)
• Accessibility (focus indicators, contrast, sr-only)
• Performance (PurgeCSS, class composition with clsx/tailwind-merge)

Usage

cp .cursorrules /path/to/your/tailwind-project/.cursorrules