Content
62%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This is a reasonably well-structured design system reference with clear MUST/SHOULD/NEVER constraints and specific token values. Its main weaknesses are the lack of executable code examples (no CSS/Tailwind/component snippets) and some apparent data quality issues (0px input height, surface-raised being near-white in a dark theme). The content would benefit from being more concise with a separate detailed reference file and adding at least one implementation example.
Suggestions
Add at least one executable code example — e.g., a CSS custom properties block defining the semantic tokens, or a sample component implementation using the design system values.
Review and fix apparent data extraction artifacts: '0px' input height and '#FEFEFD' (near-white) as 'surface-raised' in a dark theme seem incorrect and could mislead Claude.
Split the detailed reference tables (full text styles, all font sizes, border radius scale) into a separate REFERENCE.md file, keeping SKILL.md focused on the core constraints and most-used tokens.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The skill is mostly efficient with its table-based format and MUST/SHOULD/NEVER constraints, but includes some redundancy (e.g., listing both HEX and RGB for every color, the 'Typography Reference' section repeating font families/sizes already shown in the table, and some questionable values like '0px' input height that seem like extraction artifacts rather than intentional design tokens). The detected layout patterns section adds little value. | 2 / 3 |
Actionability | The skill provides concrete design tokens, specific values, and clear constraints (MUST/SHOULD/NEVER), which is good. However, it lacks executable code examples — no CSS snippets, no Tailwind config, no component code. For a UI design system skill, having at least one concrete implementation example (e.g., a button component or a CSS custom properties block) would make it significantly more actionable. | 2 / 3 |
Workflow Clarity | This is a reference/constraint skill rather than a multi-step workflow skill. For its purpose — providing design system constraints — the content is clearly organized into logical sections (Colors, Typography, Spacing, etc.) with unambiguous rules. The single-purpose nature of each section makes the guidance clear and easy to follow. | 3 / 3 |
Progressive Disclosure | The content is well-structured with clear section headers and tables, but it's a fairly long monolithic document (~150 lines of dense specification). Some sections like the full text styles table, typography reference, and border radius reference could be split into a separate reference file, keeping the SKILL.md as a concise overview with the most critical constraints. | 2 / 3 |
Total | 9 / 12 Passed |