CtrlK
BlogDocsLog inGet started
Tessl Logo

frame-liquid-bg-hero

WebGL-style fluid displacement background with a quote overlay, suited to video intros, landing heroes, or posters.

60

Quality

71%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Low

Low-risk findings worth noting

Fix and improve this skill with Tessl

tessl review fix ./skills/frame-liquid-bg-hero/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

85%

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

A concise, well-organized template spec that gives concrete visual parameters and a clear build order, held back only by describing techniques rather than providing complete executable code.

Suggestions

Include at least one complete copy-paste HTML/CSS snippet for the default CSS radial-gradient implementation so the guidance is executable rather than descriptive.

Provide a minimal inline canvas/JS skeleton for the mid-tier option instead of describing it as "80 行 inline JS".

DimensionReasoningScore

Conciseness

The body is a lean spec with bracketed sections and no concept over-explanation; every section (canvas, implementations, text layer, palette, design rules) earns its place and assumes Claude's competence.

3 / 3

Actionability

Concrete specifics are present (radial-gradient, mix-blend-mode, backdrop-filter, exact hex palettes, font names), but techniques are described rather than given as complete executable code blocks, so it is not copy-paste ready.

2 / 3

Workflow Clarity

This is a simple single-artifact skill with a clear logical build order (canvas -> background -> text -> palette -> design rules); no destructive or batch operation requires validation, so the unambiguous sequence scores 3.

3 / 3

Progressive Disclosure

Under 50 lines with no external bundle files (references/scripts/assets absent) and well-organized sections, satisfying the simple-skill allowance for a top score on progressive disclosure.

3 / 3

Total

11

/

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 is specific and distinct but reads as a product blurb rather than a trigger-oriented skill description: it states the deliverable and implied use cases without explicit "Use when..." guidance or concrete action verbs.

Suggestions

Add an explicit trigger clause, e.g. "Use when creating video intro frames, SaaS landing heroes, or poster backgrounds that need a fluid animated look."

Lead with the action Claude performs (e.g. "Generates a single-file HTML...") so the description names concrete actions, not just the output.

Soften the jargon ("WebGL-style fluid displacement") with user-facing synonyms like "animated liquid/flowing background" to improve trigger term coverage.

DimensionReasoningScore

Specificity

Names a concrete deliverable ("WebGL-style fluid displacement background with a quote overlay") but uses no action verbs describing what Claude does, so it stops at naming domain and output rather than multiple specific actions.

2 / 3

Completeness

Clearly states what the skill produces, but the "when" is only implied by "suited to..." with no explicit "Use when..." trigger clause, which caps completeness at 2 per the guidelines.

2 / 3

Trigger Term Quality

Includes natural use-case terms ("video intros, landing heroes, or posters") but pairs them with technical jargon ("WebGL-style fluid displacement"), missing common variations a user might say.

2 / 3

Distinctiveness Conflict Risk

A clear niche (fluid displacement background + quote overlay for video/hero/poster) with distinct triggers unlikely to fire for unrelated skills.

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.