pinterest-ui-skills

Pinterest's UI design system. Use when building interfaces inspired by Pinterest'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/pinterest/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 concise and well-structured with a clear 'Use when' clause that makes it easy for Claude to know when to select this skill. Its main weakness is the lack of specific concrete actions - it describes the design system's properties but not what actions it enables (e.g., creating layouts, styling components). The trigger terms could also be expanded to cover more natural user phrasings.

Suggestions

Add specific concrete actions the skill performs, e.g., 'Creates masonry grid layouts, styles card components, and applies Pinterest's visual patterns including rounded corners and shadow elevations.'

Expand trigger terms to include common user phrasings like 'Pinterest-style', 'pin board layout', 'masonry grid', 'Pinterest clone', or 'card-based UI'.

Dimension	Reasoning	Score
Specificity	Names the domain (Pinterest UI design system) and mentions some specific elements (light mode, Inter font, 4px grid), but doesn't list concrete actions like 'create cards', 'build masonry layouts', or 'style pin components'.	2 / 3
Completeness	Clearly answers both what ('Pinterest's UI design system') and when ('Use when building interfaces inspired by Pinterest's aesthetic - light mode, Inter font, 4px grid') with an explicit 'Use when' clause and trigger conditions.	3 / 3
Trigger Term Quality	Includes 'Pinterest' and 'UI design system' as relevant keywords, plus specific terms like 'Inter font' and '4px grid', but misses common user terms like 'masonry layout', 'pin board', 'card grid', 'Pinterest-style', or 'Pinterest clone'.	2 / 3
Distinctiveness Conflict Risk	Very distinct niche - specifically targets Pinterest's design aesthetic with unique identifiers (Inter font, 4px grid, light mode). Unlikely to conflict with other design system skills unless there are multiple Pinterest-specific skills.	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 values and clear MUST/SHOULD/NEVER constraints. Its main weaknesses are the lack of executable code examples (CSS/Tailwind/React snippets), some redundancy in typography sections, and the appearance of auto-generated content that hasn't been fully curated (e.g., inconsistent spacing scale of '3px, 4px, 5px, 51px, 71px' and element width of '10px' seem like artifacts). The skill would benefit significantly from concrete implementation examples and better curation of the extracted values.

Suggestions

Add executable code examples (Tailwind classes, CSS custom properties, or React component snippets) showing how to apply the design tokens in practice

Curate the auto-generated values - the spacing scale (3px, 4px, 5px, 51px, 71px) and element width (10px) appear to be raw extraction artifacts that need human review and normalization

Deduplicate the typography section - remove the 'Typography Reference' subsection that repeats information already in the Text Styles table, and consolidate the five 'text-14px' entries

Split detailed token tables into a separate TOKENS.md reference file and keep SKILL.md as a concise overview with the most common patterns

Dimension	Reasoning	Score
Conciseness	The content is mostly efficient with good use of tables and MUST/SHOULD/NEVER conventions, but includes redundant information (e.g., duplicate 'text-14px' entries with slightly different colors, restating font families and sizes that are already in the table). The 'Typography Reference' section repeats what's already in the Text Styles table. Some detected values feel auto-generated rather than curated.	2 / 3
Actionability	Provides specific values (hex codes, pixel sizes, font weights) which are concrete, but lacks executable code examples. For a UI design system skill, CSS/Tailwind snippets or component code would make this much more actionable. The guidance is specific enough to follow but not copy-paste ready for implementation.	2 / 3
Workflow Clarity	The skill is organized by design system categories (colors, typography, spacing, etc.) which provides clear structure, but there's no workflow for how to apply these guidelines when building a UI. For a design system reference, the 'When to Apply' section is minimal and there's no guidance on priority or order of application when conflicts arise.	2 / 3
Progressive Disclosure	Content is reasonably well-structured with clear sections and tables, but it's a long monolithic file that could benefit from splitting detailed token tables and component specs into separate reference files. No external references are provided, and the file is dense enough (~150 lines) that an overview + linked details pattern would improve navigation.	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.