Content
50%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This skill provides a comprehensive design system reference with clear constraints using MUST/SHOULD/NEVER language and well-organized tables of design tokens. However, it reads more like auto-extracted design audit data than a curated skill — some values appear suspect (0px input height, very granular border-radius scale), it lacks executable code examples, and the monolithic structure could benefit from splitting detailed references into separate files. The absence of a workflow for applying these guidelines and some questionable auto-detected values reduce its practical utility.
Suggestions
Add executable code examples (CSS custom properties block, Tailwind config snippet, or sample component markup) to make the design tokens immediately actionable rather than just reference tables.
Review and fix suspicious auto-generated values — input height of '0px' and spacing scale only going to 8px seem incorrect and would produce broken UIs if followed literally.
Add a brief workflow section explaining how to apply these guidelines when building a new component or page (e.g., 1. Set up tokens → 2. Apply layout → 3. Check contrast ratios → 4. Verify grid alignment).
Split detailed reference tables (full text styles list, border radius scale, component variants) into a separate REFERENCE.md file, keeping only the most essential tokens and rules in the main skill.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The skill is mostly efficient with its table-based format and MUST/SHOULD/NEVER constraints, but includes some redundant information (e.g., the full border-radius scale is listed twice, many near-duplicate text styles at 14px and 17px with minimal differentiation, and 'detected' metadata like color counts and element counts that add noise without actionability). | 2 / 3 |
Actionability | Provides concrete design tokens, specific values, and clear constraints (MUST/SHOULD/NEVER), which is good for a design system skill. However, it lacks executable code examples (e.g., CSS snippets, Tailwind config, or component markup) and some values seem auto-generated and questionable (input height of '0px', spacing scale only going to 8px for a 4px grid system), reducing practical reliability. | 2 / 3 |
Workflow Clarity | The skill is organized by design system categories (colors, typography, spacing, etc.) which provides a clear reference structure. However, there's no workflow for how to apply these guidelines when building a UI — no sequencing of steps, no validation checkpoints for checking contrast ratios or grid alignment, and no guidance on how to compose these tokens into a working interface. | 2 / 3 |
Progressive Disclosure | Content is well-sectioned with clear headings and tables, making it scannable. However, the file is quite long and monolithic — the detailed text style tables, border radius references, and component specifications could be split into separate reference files with links from the main skill, improving navigation and reducing cognitive load. | 2 / 3 |
Total | 8 / 12 Passed |