{"id":"5feda3d9-a815-4d21-aad9-cda7ff0904f7","shortId":"hWMkWq","kind":"skill","title":"tailwind","tagline":"Use when writing Tailwind classes, fixing spacing issues, reviewing CSS, or auditing Tailwind patterns. Enforces v4 best practices for grid and responsive.","description":"You are a Tailwind CSS v4 expert that detects and reports anti-patterns such as incorrect spacing, inconsistent sizing, desktop-first breakpoints, and non-GPU-accelerated animations.\n\nTargets the current project by default — or specify a path to audit a subset of files.\n\nRead individual rule files in `rules/` for detailed explanations and code examples.\n\n## Rules Overview\n\n| Rule | Impact | File |\n|------|--------|------|\n| Spacing direction | HIGH | `rules/spacing-direction.md` |\n| Equal dimensions | HIGH | `rules/equal-dimensions.md` |\n| 8px grid | HIGH | `rules/8px-grid.md` |\n| Mobile-first responsive | MEDIUM | `rules/mobile-first.md` |\n| Logical shorthands | MEDIUM | `rules/logical-shorthands.md` |\n| GPU-accelerated animations | MEDIUM | `rules/gpu-animations.md` |\n\n## Workflow\n\n### Step 1: Audit\n\nScan the target scope for violations of each rule in `rules/`. Search patterns:\n\n- `mt-*` / `pt-*` classes (spacing direction)\n- `h-X w-X` pairs where both values match (equal dimensions)\n- Odd spacing values like `p-1`, `gap-3`, `m-5` (8px grid)\n- Desktop-first breakpoints (mobile-first)\n- Verbose individual sides where shorthands apply (logical shorthands)\n- `transition-all` usage (GPU animations)\n\n### Step 2: Report\n\nList all findings grouped by rule:\n\n```\n## Tailwind CSS Audit Results\n\n### HIGH Severity\n- `src/components/Card.tsx:15` - `mt-4` → use `mb-4` or `gap` on parent\n- `src/components/Avatar.tsx:12` - `h-10 w-10` → `size-10`\n\n### MEDIUM Severity\n- `src/components/Button.tsx:8` - `p-3` (12px) → use `p-2` (8px) or `p-4` (16px)\n\n### Summary\n| Rule | Violations | Files |\n|------|-----------|-------|\n| Spacing direction | X | N |\n| Equal dimensions | Y | N |\n| **Total** | **Z** | **N** |\n```\n\n### Step 3: Fix\n\nApply fixes. For each fix:\n1. Verify the change preserves visual appearance\n2. Keep changes minimal — only fix the identified issue\n3. Adjust surrounding elements when changing spacing direction","tags":["tailwind","skills","tartinerlabs","agent-skills","automation","claude-code","claude-code-skills","cli","code-quality","developer-tools","github-actions","productivity"],"capabilities":["skill","source-tartinerlabs","skill-tailwind","topic-agent-skills","topic-automation","topic-claude-code","topic-claude-code-skills","topic-cli","topic-code-quality","topic-developer-tools","topic-github-actions","topic-productivity","topic-tailwind-css"],"categories":["skills"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/tartinerlabs/skills/tailwind","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add tartinerlabs/skills","source_repo":"https://github.com/tartinerlabs/skills","install_from":"skills.sh"}},"qualityScore":"0.453","qualityRationale":"deterministic score 0.45 from registry signals: · indexed on github topic:agent-skills · 7 github stars · SKILL.md body (1,937 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-05-18T19:13:57.118Z","embedding":null,"createdAt":"2026-05-07T20:43:04.636Z","updatedAt":"2026-05-18T19:13:57.118Z","lastSeenAt":"2026-05-18T19:13:57.118Z","tsv":"'-1':155 '-10':212,214,216 '-2':226 '-3':157,222 '-4':201,204,230 '-5':159 '1':117,255 '12':210 '12px':223 '15':199 '16px':231 '2':184,262 '3':248,271 '8':220 '8px':95,160,227 'acceler':52,111 'adjust':272 'anim':53,112,182 'anti':36 'anti-pattern':35 'appear':261 'appli':174,250 'audit':13,65,118,194 'best':18 'breakpoint':47,165 'chang':258,264,276 'class':6,134 'code':80 'css':11,28,193 'current':56 'default':59 'desktop':45,163 'desktop-first':44,162 'detail':77 'detect':32 'dimens':92,149,241 'direct':88,136,237,278 'element':274 'enforc':16 'equal':91,148,240 'exampl':81 'expert':30 'explan':78 'file':69,73,86,235 'find':188 'first':46,101,164,168 'fix':7,249,251,254,267 'gap':156,206 'gpu':51,110,181 'gpu-acceler':109 'grid':21,96,161 'group':189 'h':138,211 'h-x':137 'high':89,93,97,196 'identifi':269 'impact':85 'inconsist':42 'incorrect':40 'individu':71,170 'issu':9,270 'keep':263 'like':153 'list':186 'logic':105,175 'm':158 'match':147 'mb':203 'medium':103,107,113,217 'minim':265 'mobil':100,167 'mobile-first':99,166 'mt':132,200 'n':239,243,246 'non':50 'non-gpu-acceler':49 'odd':150 'overview':83 'p':154,221,225,229 'pair':143 'parent':208 'path':63 'pattern':15,37,131 'practic':19 'preserv':259 'project':57 'pt':133 'read':70 'report':34,185 'respons':23,102 'result':195 'review':10 'rule':72,75,82,84,127,129,191,233 'rules/8px-grid.md':98 'rules/equal-dimensions.md':94 'rules/gpu-animations.md':114 'rules/logical-shorthands.md':108 'rules/mobile-first.md':104 'rules/spacing-direction.md':90 'scan':119 'scope':122 'search':130 'sever':197,218 'shorthand':106,173,176 'side':171 'size':43,215 'skill' 'skill-tailwind' 'source-tartinerlabs' 'space':8,41,87,135,151,236,277 'specifi':61 'src/components/avatar.tsx':209 'src/components/button.tsx':219 'src/components/card.tsx':198 'step':116,183,247 'subset':67 'summari':232 'surround':273 'tailwind':1,5,14,27,192 'target':54,121 'topic-agent-skills' 'topic-automation' 'topic-claude-code' 'topic-claude-code-skills' 'topic-cli' 'topic-code-quality' 'topic-developer-tools' 'topic-github-actions' 'topic-productivity' 'topic-tailwind-css' 'total':244 'transit':178 'transition-al':177 'usag':180 'use':2,202,224 'v4':17,29 'valu':146,152 'verbos':169 'verifi':256 'violat':124,234 'visual':260 'w':141,213 'w-x':140 'workflow':115 'write':4 'x':139,142,238 'y':242 'z':245","prices":[{"id":"65ab6138-7104-4718-8158-67ff89d222ec","listingId":"5feda3d9-a815-4d21-aad9-cda7ff0904f7","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"tartinerlabs","category":"skills","install_from":"skills.sh"},"createdAt":"2026-05-07T20:43:04.636Z"}],"sources":[{"listingId":"5feda3d9-a815-4d21-aad9-cda7ff0904f7","source":"github","sourceId":"tartinerlabs/skills/tailwind","sourceUrl":"https://github.com/tartinerlabs/skills/tree/main/skills/tailwind","isPrimary":false,"firstSeenAt":"2026-05-18T13:21:01.902Z","lastSeenAt":"2026-05-18T19:13:57.118Z"},{"listingId":"5feda3d9-a815-4d21-aad9-cda7ff0904f7","source":"skills_sh","sourceId":"tartinerlabs/skills/tailwind","sourceUrl":"https://skills.sh/tartinerlabs/skills/tailwind","isPrimary":true,"firstSeenAt":"2026-05-07T20:43:04.636Z","lastSeenAt":"2026-05-07T22:41:57.859Z"}],"details":{"listingId":"5feda3d9-a815-4d21-aad9-cda7ff0904f7","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"tartinerlabs","slug":"tailwind","github":{"repo":"tartinerlabs/skills","stars":7,"topics":["agent-skills","automation","claude-code","claude-code-skills","cli","code-quality","developer-tools","github-actions","productivity","tailwind-css"],"license":"mit","html_url":"https://github.com/tartinerlabs/skills","pushed_at":"2026-05-17T09:09:47Z","description":"Claude Code skills for git workflows, GitHub automation, security audits, code refactoring, and project tooling","skill_md_sha":"e05e8f99e0788e603970186694aebb0fa138de2f","skill_md_path":"skills/tailwind/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/tartinerlabs/skills/tree/main/skills/tailwind"},"layout":"multi","source":"github","category":"skills","frontmatter":{"name":"tailwind","description":"Use when writing Tailwind classes, fixing spacing issues, reviewing CSS, or auditing Tailwind patterns. Enforces v4 best practices for grid and responsive."},"skills_sh_url":"https://skills.sh/tartinerlabs/skills/tailwind"},"updatedAt":"2026-05-18T19:13:57.118Z"}}