CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

design-system

Captures the user's brand identity once via a 10-question onboarding wizard (primary/accent HEX + heading + body Google Fonts + design style editorial/technical/minimal/playful + default output directory + syntax theme + TOC behavior + optional logo/company), validates body-text and link contrast against WCAG 2.2 AA, derives 12 CSS custom properties in HSL space, and stores the result for every markdown-html converter to consume. Use before any markdown-html conversion. Triggers on first-run onboarding ("set up the brand", "configure markdown-html", "run onboarding"), on explicit reset ("reset the design system", "re-onboard"), and is checked by every converter via config_loader.py before rendering. Refuses to save if body-text contrast fails AA 4.5:1 or the output dir isn't writable. Precedence is project (./.markdown-html/), then global (~/.config/markdown-html/), then built-in defaults; MARKDOWN_HTML_NO_CONFIG=1 bypasses.

68

Quality

85%

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

SKILL.md
Quality
Evals
Security

Quality

Content

77%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.

A well-structured, highly actionable body with a clearly sequenced, validated onboarding workflow and real error-recovery loops. The main defect is navigation: the three bundled references/ files are never referenced from the body, and worked-example commands rely on '.../' path shorthand that blocks copy-paste execution.

Suggestions

Link the bundled reference files where they are relevant, e.g. under Hard rules add 'Contrast floor details: See [wcag_accessibility.md](references/wcag_accessibility.md)' and under the token table 'Token taxonomy rationale: See [design_token_canon.md](references/design_token_canon.md)' and 'Font pairing guidance: See [typography_pairing.md](references/typography_pairing.md)'.

Replace the '.../' path abbreviations in the worked-example block with the full 'markdown-html/skills/design-system/scripts/…' path used in the first command so every example is copy-paste runnable.

Trim the 'Forcing-question library' canon citations (book titles, publisher attributions) down to the recommendation itself, or move the library into a reference file.

DimensionReasoningScore

Conciseness

The body is almost entirely operational — tables of triggers, questions, tokens, and rules — and never explains concepts Claude already knows (it cites WCAG §1.4.3 rather than teaching contrast). Not 5: the 'Forcing-question library' section with book/canon citations and parts of the References list are editorial framing rather than tokens that earn their place for execution.

4 / 5

Actionability

Concrete, runnable guidance throughout: exact invocations ('python3 .../onboard.py --set brand.primary=#FF6B35 --set design_style=editorial', 'MARKDOWN_HTML_NO_CONFIG=1 python3 .../config_loader.py --show', 'python3 .../brand_palette_validator.py --primary "#FF6B35" --accent "#00D4AA"'), exit codes (3, 4), and a full 10-question key/default table. Not 5: most worked-example commands abbreviate the script path as '.../' after the full path is shown once, so the majority of the block is not literally copy-paste ready.

4 / 5

Workflow Clarity

The flow is explicit and validated end-to-end: a symptom→action 'When to invoke' table, then onboarding with hard-rule checkpoints — 'brand_palette_validator.validate() runs after every change…If either fails, onboard.py refuses to save (exit code 4) and tells the user to pick a darker primary…or override brand.text directly' — which is a validate→fix→retry feedback loop, plus a writability precheck (exit code 3) and a 'checked by every converter via config_loader.py before rendering' gate. Not 4: checkpoints and error-recovery paths are explicit, not merely implied.

5 / 5

Progressive Disclosure

The body itself is well-sectioned and appropriately lean, and it correctly points to assets/design_system_schema.json (a real file). But the actual bundle ships three reference files — references/design_token_canon.md, references/typography_pairing.md, references/wcag_accessibility.md — and none of them are mentioned or linked anywhere in the body, leaving them undiscoverable; the 'References' section instead lists external books and non-bundle paths. Not 4: this is not a minor organization gap but a whole class of provided material that is never signaled.

3 / 5

Total

16

/

20

Passed

Description

88%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.

A dense, third-person, action-oriented description that answers both 'what' and 'when' with explicit quoted triggers and failure conditions. Its only weaknesses are a few missing natural synonyms ('theme', 'branding', 'rebrand') and a couple of trigger phrases generic enough to overlap with other onboarding/brand skills.

Suggestions

Add one or two natural synonyms users would say, e.g. trigger on 'change the brand colors', 'rebrand the HTML output', or 'theme the conversions'.

Qualify the generic triggers with their scope, e.g. 'set up the brand (for markdown-html output)', to reduce overlap with non-markdown brand/onboarding skills.

DimensionReasoningScore

Specificity

The description lists multiple concrete actions — 'Captures the user's brand identity once via a 10-question onboarding wizard', 'validates body-text and link contrast against WCAG 2.2 AA', 'derives 12 CSS custom properties in HSL space', 'Refuses to save if body-text contrast fails AA 4.5:1 or the output dir isn't writable' — with comprehensive, parameterized coverage of inputs, behavior, and failure modes. Not 4: there are no minor coverage gaps; even precedence order and the bypass env var are stated as concrete behaviors.

5 / 5

Completeness

Both questions are answered explicitly: the 'what' is a full action inventory (capture, validate, derive, store, refuse-on-failure) and the 'when' is stated twice — 'Use before any markdown-html conversion' and 'Triggers on first-run onboarding…on explicit reset' — with concrete trigger phrases. Not 4: the 'when' is not merely implied or generic; it names specific trigger events.

5 / 5

Trigger Term Quality

Quoted trigger phrases like 'set up the brand', 'configure markdown-html', 'run onboarding', 'reset the design system', 're-onboard' are natural user phrasings with good coverage. Not 5: common synonyms a user might actually say — 'branding', 'theme', 'change the colors', 'rebrand' — are absent, so coverage is good rather than comprehensive.

4 / 5

Distinctiveness Conflict Risk

The niche is clearly fenced to the markdown-html plugin ('stores the result for every markdown-html converter to consume', 'checked by every converter via config_loader.py'), so most triggers are distinct. Not 5: generic quoted phrases like 'set up the brand' and 'run onboarding' carry minor overlap risk with closely related brand/onboarding skills outside the markdown-html context.

4 / 5

Total

18

/

20

Passed

Validation

93%

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

Validation — 15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

metadata_field

'metadata' should map string keys to string values

Warning

Total

15

/

16

Passed

Repository

alirezarezvani/claude-skills

Path

markdown-html/skills/design-system/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.