CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

ui-contrast-review

Reviewing UI for light/dark contrast, readability, focus states, color-token drift, theme regressions.

Quality

70%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide
SecuritybySnyk

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./skills/ui-contrast-review/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

67%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The body delivers a clear, well-sequenced review workflow with genuinely actionable specifics (named tokens, WCAG thresholds, an output template) and needs no external references. Its main weaknesses are the promotional footer padding, mild redundancy between the fix-guidance sections, and the absence of any verification step for its own findings.

Suggestions

Remove the 'About this skill' promotional footer (Synter links, social handles) — it is pure token padding with no instructional value and directly hurts conciseness.

Consolidate 'Good Fix Patterns' and the 'Recommend the smallest durable fix' workflow step, which cover the same ground, into a single fix-priority section.

Add a light verification checkpoint, e.g. re-checking flagged pairs in both themes before writing findings, to close the workflow's validation gap.

DimensionReasoningScore

Conciseness

The core workflow is lean bullet lists with no explanation of concepts Claude already knows, but the promotional 'About this skill' footer (~10 lines of ad links) is pure padding, and 'Good Fix Patterns'/'Avoid' partially restate workflow step 5 — noticeable tightening possible, short of the severe padding of anchor 2.

3 / 5

Actionability

For an instruction-only skill the guidance is concrete: named token patterns like 'text-muted-foreground' and 'border-white/10', specific WCAG ratios (4.5:1, 3:1), a list of exact UI pairs to inspect, and a copy-ready findings template — minor gaps only (no command/tool for measuring contrast).

4 / 5

Workflow Clarity

A clear 5-step sequence (identify surfaces → check both themes → inspect high-risk pairs → check token drift → recommend smallest fix) with an explicit empty-result protocol ('If no issues are found, state that explicitly and mention what was checked'); as a review-only skill the destructive/batch cap doesn't apply, but there is no verification checkpoint on the review's own findings.

4 / 5

Progressive Disclosure

No bundle files exist and the skill is self-contained with well-organized, clearly headed sections; however, at ~125 lines (including the off-topic promotional footer) it exceeds the under-50-line simple-skill case, and lists like the high-risk pairs could arguably live in a reference file — good structure with minor organization gaps.

4 / 5

Total

15

/

20

Passed

Description

58%Weight 40%Scale 1-5

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 names a clear niche and enumerates several concrete review targets, but it omits any 'when to use' trigger guidance and lacks natural user phrasings like 'dark mode' or 'accessibility'. Adding an explicit 'Use when...' clause with those synonyms would raise both completeness and trigger term quality.

Suggestions

Add an explicit trigger clause, e.g. 'Use when reviewing UI for dark-mode/light-mode contrast, accessibility, or theme regressions' — the missing 'when' currently caps completeness at 3.

Include natural user phrasings and synonyms such as 'dark mode', 'light mode', 'accessibility', 'a11y', or 'WCAG' alongside the existing technical terms.

Consider naming 1-2 concrete actions beyond the single verb 'Reviewing' (e.g. 'audit', 'flag failing pairs', 'recommend token fixes') to reach comprehensive capability coverage.

DimensionReasoningScore

Specificity

Enumerates several concrete review targets — 'light/dark contrast, readability, focus states, color-token drift, theme regressions' — going beyond the 1-2 actions of anchor 3, though the single verb 'Reviewing' leaves minor gaps versus the comprehensive coverage of anchor 5.

4 / 5

Completeness

The 'what' is clear (reviewing UI for contrast and theme-related failures), but there is no 'Use when...' clause or equivalent explicit trigger guidance, which caps completeness at 3 per the judging guidelines.

3 / 5

Trigger Term Quality

Contains relevant keywords like 'contrast', 'light/dark', 'focus states', and 'theme regressions', but misses common natural variations users would say such as 'dark mode', 'accessibility'/'a11y', or 'WCAG'.

3 / 5

Distinctiveness Conflict Risk

The contrast/theme-regression niche is fairly distinct with specific triggers (focus states, color-token drift), carrying only minor overlap risk with a broader accessibility-audit skill, fitting anchor 4 rather than the broader overlap of anchor 3.

4 / 5

Total

14

/

20

Passed

Validation

100%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository

Synter-Media-AI/free-skills

Path

skills/ui-contrast-review/SKILL.md

Reviewed

Table of Contents

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.