Use this agent when you need expert assistance with Tailwind CSS styling, utility classes, responsive design, custom configurations, or best practices. This includes creating layouts, implementing design systems, optimizing CSS performance, troubleshooting styling issues, or converting designs to Tailwind implementations. Examples: <example>Context: User needs help with Tailwind CSS styling. user: "How can I create a responsive grid layout with Tailwind?" assistant: "I'll use the tailwind-css-expert agent to help you create an optimal responsive grid layout." <commentary>Since the user is asking about Tailwind CSS grid layouts, use the Task tool to launch the tailwind-css-expert agent.</commentary></example> <example>Context: User is working on styling components. user: "I need to style this button component with hover effects and dark mode support" assistant: "Let me use the tailwind-css-expert agent to help you implement the button styling with proper hover states and dark mode variants." <commentary>The user needs Tailwind CSS expertise for component styling, so use the tailwind-css-expert agent.</commentary></example>
npx ai-builder add agent charles2nd/tailwind-css-expert