CtrlK
BlogDocsLog inGet started
Tessl Logo

clean-minimal-beige-light-mode

Create a clean minimal beige light-mode design system with warm neutral shells, quiet process grids, restrained accent color, and elegant low-contrast structure.

52

Quality

56%

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 ./agent-skills/web-design/clean-minimal-beige-light-mode/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

55%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 is concise and well-organized as aesthetic guidance, but it reads as a mood brief rather than a working skill: the Workflow section is literally empty and no concrete design tokens or examples ground the directions. Filling or removing the Workflow section and adding specific values (palette, type, spacing, radius) would make it actionable.

Suggestions

Fill the empty '## Workflow' section (or remove the heading) with a concrete sequence, e.g., define palette tokens → set type scale → build shell/grid layout → style components → apply accent/verification against the Avoid list.

Add concrete design tokens so guidance is executable: hex values for the beige/stone/cream surfaces and the accent, a type scale, border radii, and spacing values for the 'Tuning knobs' to adjust.

Include one compact example pattern (e.g., a short HTML/CSS snippet of the hero + process grid or a token table) so 'Recommended patterns' is copy-paste reference rather than description.

DimensionReasoningScore

Conciseness

The body is lean bullet-style guidance with no explanation of concepts Claude already knows; only minor trimming is needed (the 'Use When' bullet repeats the description verbatim, and Scope overlaps Visual target).

4 / 5

Actionability

Structure and components are named concretely (centered master container, equal-column modular grid, tiny status dots, small dark inset cards), but all guidance stays high-level — no hex palette, type scale, radius, spacing values, or example markup to make it directly executable.

3 / 5

Workflow Clarity

The dedicated '## Workflow' section is an empty heading with no content and no sequence exists anywhere in the body; the section ordering (Scope → Visual target → Implementation → Patterns) only implies a rough direction, leaving large gaps.

2 / 5

Progressive Disclosure

At under 50 lines with no external references needed, the sections are well-organized and easy to navigate, but the dangling empty '## Workflow' heading is a real structural flaw that keeps it below the top anchor.

4 / 5

Total

13

/

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 is specific and distinctive about its aesthetic niche, but it answers only 'what' — it never states when Claude should use it. Adding an explicit 'Use when...' clause with natural trigger phrases (e.g., 'light theme', 'warm neutral palette') would lift both completeness and trigger-term quality.

Suggestions

Append a trigger clause such as: 'Use when the user asks for a light-mode design system, warm or beige neutral palette, calm minimal UI, or a light premium aesthetic.'

Include natural synonyms users would say — 'light theme', 'warm neutral palette', 'soft minimal UI' — to broaden trigger-term coverage.

Name the concrete deliverables (color tokens, typography, component styling) to strengthen the 'what' beyond a single create verb.

DimensionReasoningScore

Specificity

The single action verb 'Create' is enriched with several specific concrete elements ('warm neutral shells, quiet process grids, restrained accent color, low-contrast structure'), placing it above the 1-2-action anchor but below comprehensive multi-action coverage since no artifact types are named.

4 / 5

Completeness

The 'what' is clear and specific (create a beige light-mode design system), but 'when' is entirely absent — no 'Use when...' clause or equivalent trigger guidance, which the judging guidelines cap at 3.

3 / 5

Trigger Term Quality

Natural terms like 'light-mode', 'minimal', 'beige', and 'design system' are present, but common variations users might say ('light theme', 'warm palette', 'neutral UI') and any 'Use when...' phrasing are missing.

3 / 5

Distinctiveness Conflict Risk

'beige light-mode' with 'warm neutral shells' and 'quiet process grids' carves a narrow aesthetic niche with distinct triggers, though the broad term 'design system' carries minor overlap risk with other design/brand skills.

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
MengTo/Skills
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.