CtrlK
BlogDocsLog inGet started
Tessl Logo

artifacts-builder

Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui).

44

Quality

46%

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/artifacts-builder/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

35%

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

This is a catalog stub that advertises and redirects to an upstream bundle rather than delivering functional skill content. It is organized and brief but offers no executable guidance, no real workflow, and no local progressive disclosure for the actual artifact-building task.

Suggestions

Replace the `open <url>` placeholder and "inspect the upstream README" deferral with concrete, copy-paste-ready install/usage commands so the body is actionable on its own.

Either inline a minimal Quick start with a working React/Tailwind artifact example, or ship local reference files under references/ that the body links to one level deep, instead of pointing off-repo to GitHub.

Remove the verbatim repetition of the description in "What it does" and the "Curated from..." filler to tighten conciseness.

DimensionReasoningScore

Conciseness

The body is short and avoids explaining concepts Claude already knows, but it repeats the frontmatter description verbatim in the "What it does" section and carries promotional filler ("Curated from ComposioHQ awesome-claude-skills"), so it is "mostly efficient but could be tightened" rather than fully lean.

2 / 3

Actionability

The only concrete-looking command is `open https://github.com/...` (a browser placeholder), and the real guidance is "inspect the upstream README" then "ask the agent to invoke this skill" — it describes rather than instructs, with no executable code or commands for the skill's actual artifact-building task, matching the level-1 anchor.

1 / 3

Workflow Clarity

A loose sequence exists (inspect README → install bundle → invoke by name/trigger), but the steps are vague ("install the upstream bundle" with no concrete command) and lack any validation checkpoint, fitting the level-2 anchor of "steps listed but validation gaps; sequence present but checkpoints missing" rather than the fully specified level 3.

2 / 3

Progressive Disclosure

Sections (What it does / Source / How to use) are organized, but there are no local bundle files (references/, scripts/, assets/ are absent) and all substantive content is deferred to an external GitHub URL rather than one-level-deep local references, so structure is present but the disclosure is not cleanly localized to the skill.

2 / 3

Total

7

/

12

Passed

Description

57%

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 clearly scopes a niche (claude.ai HTML artifacts with a modern frontend stack) but stops short of listing concrete actions and omits any explicit "Use when..." guidance. It is distinguishable and reasonably triggered, just not comprehensive.

Suggestions

Add an explicit "Use when..." clause naming concrete triggering situations (e.g. building React/Tailwind components for claude.ai artifacts) to lift completeness from 2 to 3.

Replace the single verb "creating" with several concrete actions (e.g. scaffold, compose multi-component layouts, style with shadcn/ui) to strengthen specificity.

Broaden trigger terms with common user phrasings like "web app", "landing page", or "dashboard" to improve trigger-term coverage.

DimensionReasoningScore

Specificity

"Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts" names the domain and tech stack (React, Tailwind, shadcn/ui) but lists only one action ("creating") rather than multiple concrete operations, matching the level-2 anchor and falling short of level 3's "lists multiple specific concrete actions".

2 / 3

Completeness

The description answers "what does this do" but provides no explicit "Use when..." trigger clause, so per the judging guidelines completeness is capped at 2 ("has what, but when is missing or only implied").

2 / 3

Trigger Term Quality

Terms like "HTML artifacts", "multi-component", and "React" are reasonable user language, but common variations a user might actually say (e.g. "web app", "landing page", "dashboard") are missing, fitting the level-2 anchor of "some relevant keywords but missing common variations" rather than level 3's broad coverage.

2 / 3

Distinctiveness Conflict Risk

The narrow niche of claude.ai HTML artifacts built with a specific React/Tailwind/shadcn stack, paired with distinct trigger phrases ("html artifact", "react artifact", "multi component artifact"), makes it unlikely to fire for unrelated skills, matching the level-3 "clear niche with distinct triggers" anchor.

3 / 3

Total

9

/

12

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.

Validation15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

15

/

16

Passed

Repository
nexu-io/open-design
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.