amplitude-ui-skills

Amplitude's UI design system. Use when building interfaces inspired by Amplitude's aesthetic - light mode, Inter font, 4px grid.

Quality

62%

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Securityby

Passed

No known issues

Optimize this skill with Tessl

npx tessl skill review --optimize ./skills/amplitude/SKILL.md

Quality

Discovery

75%

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

The description is well-structured with a clear 'Use when' clause and distinctive brand-specific triggers that minimize conflict risk. However, it lacks concrete action verbs describing what the skill actually does (e.g., generating components, applying styles, creating layouts) and could benefit from additional natural trigger terms users might use when requesting Amplitude-style interfaces.

Suggestions

Add specific concrete actions the skill performs, e.g., 'Generates UI components, applies color palettes, and structures layouts following Amplitude's design system.'

Include additional natural trigger terms users might say, such as 'dashboard design', 'analytics UI', 'Amplitude-style components', or 'design tokens'.

Dimension	Reasoning	Score
Specificity	Names the domain (UI design system) and mentions some specific elements (light mode, Inter font, 4px grid), but doesn't list concrete actions like 'create components', 'apply styles', or 'build layouts'.	2 / 3
Completeness	Clearly answers both what ('Amplitude's UI design system') and when ('Use when building interfaces inspired by Amplitude's aesthetic - light mode, Inter font, 4px grid') with an explicit 'Use when' clause and trigger conditions.	3 / 3
Trigger Term Quality	Includes 'Amplitude', 'UI design system', 'light mode', 'Inter font', and '4px grid' which are relevant but somewhat niche. Missing common user terms like 'dashboard', 'components', 'design tokens', 'styling', or 'theme'.	2 / 3
Distinctiveness Conflict Risk	Very distinct due to the specific brand name 'Amplitude' and the precise design parameters (Inter font, 4px grid, light mode). Unlikely to conflict with other design system skills unless another Amplitude-specific skill exists.	3 / 3
	Total	10 / 12 Passed

Implementation

50%

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 specific, concrete values (colors, typography, spacing). Its main weaknesses are the lack of executable code examples (CSS/Tailwind/component snippets), some raw/unprocessed data that feels auto-extracted rather than curated, and the monolithic structure that could benefit from splitting detailed reference tables into separate files.

Suggestions

Add executable code examples (e.g., Tailwind config snippets, CSS custom properties block, or a sample component) to make the design tokens immediately actionable.

Split detailed reference tables (full typography scale, all font sizes, border radius reference) into a separate REFERENCE.md file, keeping only the most-used values in the main skill.

Clean up apparent raw extraction artifacts: remove duplicate text style entries, clarify the contradictory 'light-mode' description with '#000000 page background', and curate the element widths list to only include meaningful layout values.

Add a brief composition workflow or example showing how to combine these tokens to build a typical Amplitude-style component (e.g., a card or nav bar).

Dimension	Reasoning	Score
Conciseness	The content is mostly efficient with good use of tables and MUST/SHOULD/NEVER conventions, but includes some redundancy (e.g., listing font sizes twice, duplicate text-14px and text-13px entries, 'Border Radius Reference' repeating the scale already listed above). The 'Detected Layout Patterns' and 'consistent element widths' like 17px and 9px feel like raw extracted data rather than curated guidance.	2 / 3
Actionability	Provides specific values (hex codes, sizes, spacing scales) which are concrete, but lacks executable code examples. For a UI design system skill, CSS/Tailwind snippets or component code would make this copy-paste ready. The button component table only has one variant (Ghost) which feels incomplete.	2 / 3
Workflow Clarity	The skill is primarily a reference document rather than a multi-step workflow, so strict workflow requirements are relaxed. However, the 'When to Apply' section is vague, and there's no guidance on how to compose these tokens together or prioritize conflicting rules. For a design system, a brief workflow like 'start with layout → apply colors → add typography → verify contrast' would help.	2 / 3
Progressive Disclosure	Content is well-organized with clear section headers and tables, but it's a long monolithic file (~150 lines of detailed reference data). The typography reference, spacing scales, and border radius scales could be split into separate reference files, with the main SKILL.md providing a concise overview and links.	2 / 3
	Total	8 / 12 Passed

Validation

100%

Warnings & errors only

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.

Repository: ihlamury/design-skills
Commit: 126714e

Reviewed: 8 days ago

Table of Contents

Discovery Implementation Validation

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.