Imported from meghal86/stacksignal (.agents/skills/css-to-tailwind/SKILL.md). Install upstream with npx skills add meghal86/stacksignal --skill css-to-tailwind. Copyright stays with the author.

CSS to Tailwind

Got legacy CSS? Convert it to Tailwind classes. Handles complex selectors and media queries.

Quick Start

npx ai-css-to-tailwind ./src/styles/button.css

What It Does

• Converts CSS rules to Tailwind utilities
• Handles responsive breakpoints
• Converts custom properties to theme values
• Preserves complex hover/focus states

Usage Examples

# Convert a CSS file
npx ai-css-to-tailwind ./styles/header.css

# Convert and update component
npx ai-css-to-tailwind ./styles/card.css --update ./components/Card.tsx

# Batch convert
npx ai-css-to-tailwind ./styles/*.css

What It Handles

• Media queries → responsive prefixes
• Pseudo-classes → state variants
• CSS variables → theme tokens
• Complex selectors → component patterns

Requirements

Node.js 18+. OPENAI_API_KEY required.

License

MIT. Free forever.

Built by LXGIC Studios

• GitHub: github.com/lxgicstudios/ai-css-to-tailwind
• Twitter: @lxgicstudios