tailwind
Utility-first CSS.
Works with
Claude CodeCursorCodex CLIGitHub CopilotGemini CLI
Agent Skills format with YAML frontmatter. Claude Code reads it as-is.
---
name: "tailwind"
description: "Utility-first CSS."
license: "MIT"
---
# Tailwind
> Utility-first CSS.
---
## When To Use
- Rapid styling
- Modern UIs
- Component libraries
---
## What To Do
### 1. Classes
```html
<div class="p-4 bg-blue-500 text-white rounded-lg">
Content
</div>
```
### 2. Common
| Class | What |
|-------|------|
| p-4 / m-4 | Padding/Margin |
| flex / grid | Layout |
| bg-red-500 | Background |
| text-sm | Text size |
| w-full | Width |
### 3. Responsive
```html
<div class="w-full md:w-1/2">
Mobile first
</div>
```
### 4. Config
```javascript
// tailwind.config.js
module.exports = {
content: ['./src/**/*.{js,ts,jsx,tsx}'],
theme: { extend: {} },
plugins: []
}
```
---
**Role**: Tailwind Developer
**Input**: HTML
**Output**: Styled
> Utility CSS.More General & Other skills
find-skills
vercel-labs/skills
Helps users discover and install agent skills when they ask questions like "how do I do X", "find a skill for X", "is there a skill that can...", or express interest in extending capabilities. This skill should be used when the user is looking for functionality that might exist as an installable skill.
1.5M
grill-me
mattpocock/skills
A relentless interview to sharpen a plan or design.
972.7k
grill-with-docs
mattpocock/skills
A relentless interview to sharpen a plan or design, which also creates docs (ADR's and glossary) as we go.
828.8k
