lemonsqueezy-ui-skills

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

Quality

68%

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/lemonsqueezy/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 has a clear 'Use when' clause and is distinctive due to the Lemonsqueezy brand reference and specific design attributes. However, it lacks concrete action verbs describing what the skill actually does (e.g., generating components, styling elements) and could benefit from broader trigger terms related to UI building tasks.

Suggestions

Add specific concrete actions the skill performs, e.g., 'Creates buttons, cards, layouts, and form elements following Lemonsqueezy's design system.'

Expand trigger terms to include common user phrases like 'components', 'theme', 'styling', 'dashboard UI', or 'web app design' to improve discoverability.

Dimension	Reasoning	Score
Specificity	Names the domain (UI design system) and mentions some specific details like 'light mode, Inter font, 4px grid', but doesn't list concrete actions (e.g., 'create buttons, style forms, build layouts'). It describes attributes rather than actions.	2 / 3
Completeness	Clearly answers both 'what' (Lemonsqueezy's UI design system) and 'when' (Use when building interfaces inspired by Lemonsqueezy's aesthetic) with an explicit 'Use when...' clause and trigger details.	3 / 3
Trigger Term Quality	Includes some relevant keywords like 'Lemonsqueezy', 'UI', 'design system', 'light mode', 'Inter font', and 'interfaces', but misses common variations users might say such as 'components', 'theme', 'styling', 'dashboard', or 'web app design'.	2 / 3
Distinctiveness Conflict Risk	The specific brand name 'Lemonsqueezy' combined with concrete design attributes (Inter font, 4px grid, light mode) creates a clear niche that is unlikely to conflict with other generic UI or design system skills.	3 / 3
	Total	10 / 12 Passed

Implementation

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 semantic tokens, typography scales, and interaction guidelines using effective MUST/SHOULD/NEVER constraint language. Its main weaknesses are the lack of executable implementation examples (no CSS/Tailwind code snippets) and some raw design-audit artifacts that could be cleaned up or moved to separate reference files. The content would benefit from showing how to apply these tokens in practice rather than just listing values.

Suggestions

Add executable code examples showing implementation, e.g., a CSS custom properties block defining the semantic tokens, or a Tailwind config snippet mapping the design scale values.

Remove or consolidate duplicate/near-identical entries in the Text Styles table (multiple 'text-25px' and 'text-15px' rows with trivially different colors) to reduce noise.

Move detailed reference tables (full typography matrix, layout patterns) to a separate REFERENCE.md and keep SKILL.md as a concise overview with the most essential tokens and rules.

Replace raw audit artifacts like 'used 18x', 'Count' columns, and 'currently 12 colors detected' with curated, actionable guidance.

Dimension	Reasoning	Score
Conciseness	The content is mostly efficient with well-structured tables and clear MUST/SHOULD/NEVER constraints, but includes some redundancy (e.g., duplicate 'text-25px' and 'text-15px' entries with near-identical values, 'Detected Layout Patterns' with raw pixel dumps that add little value). The raw detection counts ('used 18x', 'Count' column) feel like unprocessed design audit output rather than curated guidance.	2 / 3
Actionability	Provides specific values (hex codes, pixel sizes, border radii) which are concrete, but lacks executable code examples showing how to implement these in CSS/Tailwind/React. The guidance is declarative ('MUST use X') rather than showing copy-paste ready implementation patterns like CSS custom properties or Tailwind config snippets.	2 / 3
Workflow Clarity	This is a design system reference, not a multi-step workflow. The single-purpose nature (apply these design tokens when building UI) is unambiguous, and the content is clearly organized by concern (colors, typography, spacing, etc.) with explicit constraints using MUST/SHOULD/NEVER language.	3 / 3
Progressive Disclosure	The content is well-sectioned with clear headings and tables, but it's a fairly long monolithic file. The detailed typography reference tables, layout patterns, and component specifications could be split into separate reference files with the SKILL.md serving as a concise overview pointing to them.	2 / 3
	Total	9 / 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.