tailwind-patterns
Quick reference for Tailwind CSS utility patterns, responsive design, and configuration. Triggers on: tailwind, utility classes, responsive design, tailwind config, dark mode css, tw classes.
Install with Tessl CLI
npx tessl i github:NeverSight/skills_feed --skill tailwind-patterns96
Does it follow best practices?
Validation for skill structure
Discovery
89%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
This is a solid skill description with excellent trigger term coverage and clear distinctiveness for Tailwind CSS tasks. The main weakness is the lack of specific concrete actions - it describes what the skill is about but not what specific tasks it can perform (e.g., generating utility classes, configuring themes, converting CSS to Tailwind).
Suggestions
Add specific concrete actions like 'Generate utility class combinations, configure tailwind.config.js, convert CSS to Tailwind utilities' to improve specificity.
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Names the domain (Tailwind CSS) and mentions some areas (utility patterns, responsive design, configuration), but lacks concrete actions like 'generate classes', 'configure themes', or 'convert styles'. | 2 / 3 |
Completeness | Explicitly answers both what ('Quick reference for Tailwind CSS utility patterns, responsive design, and configuration') and when ('Triggers on:' with explicit trigger terms), meeting the requirement for explicit trigger guidance. | 3 / 3 |
Trigger Term Quality | Includes good natural keywords users would say: 'tailwind', 'utility classes', 'responsive design', 'tailwind config', 'dark mode css', 'tw classes' - these cover common variations and natural user language. | 3 / 3 |
Distinctiveness Conflict Risk | Clear niche focused specifically on Tailwind CSS with distinct triggers like 'tailwind', 'tw classes', 'tailwind config' that are unlikely to conflict with general CSS or other framework skills. | 3 / 3 |
Total | 11 / 12 Passed |
Implementation
100%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This is an excellent reference skill that maximizes utility while minimizing token usage. It provides immediately actionable code snippets organized into logical categories with clear tables for quick lookup. The skill correctly assumes Claude's competence with CSS/HTML and focuses purely on Tailwind-specific patterns.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | Extremely lean and efficient. No unnecessary explanations of what Tailwind is or how CSS works. Every section is a direct reference table or copy-paste code snippet. | 3 / 3 |
Actionability | All examples are fully executable HTML/JS snippets that can be directly copied. Includes complete class combinations for common patterns like cards, buttons, and form inputs. | 3 / 3 |
Workflow Clarity | This is a reference skill, not a multi-step workflow. The single-purpose nature (quick lookup of Tailwind patterns) is clear and unambiguous. No destructive operations requiring validation. | 3 / 3 |
Progressive Disclosure | Well-organized with clear sections. Appropriately references external file for detailed component patterns without nesting. The main content stays concise while pointing to deeper resources. | 3 / 3 |
Total | 12 / 12 Passed |
Validation
100%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 11 / 11 Passed
Validation for skill structure
No warnings or errors.
- Reviewed
Table of Contents
Is this your skill?
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.