CtrlK
BlogDocsLog inGet started
Tessl Logo

landing

Generates a premium single-page HTML landing page with 3D CSS animations, GSAP scroll effects, and mouse-parallax depth. Forcing intake (product + elevator pitch, audience register, brand overrides, tone) locks down positioning before any copy or markup is written, so the page reflects the actual product rather than generic boilerplate. Use whenever the user says 'landing for X', 'create a landing page', 'build a landing page', 'make a landing page for X', 'I need a web page for Y', or provides product/service details and wants a polished website. Also triggers on 'promotional page', 'product page', 'one-pager', 'web presence', 'sales page'. Outputs a single self-contained HTML file (Claude Code) or HTML artifact (Claude.ai). Supports configurable brand colors via CSS custom property overrides.

75

Quality

92%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

The risk profile of this skill

SKILL.md
Quality
Evals
Security

Quality

Content

88%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 highly actionable and well-sequenced with explicit validation and a regenerate-on-fail feedback loop, and it leverages real reference/script bundles with clear navigation. Weaknesses are limited to minor conciseness redundancy and some overlap between inlined specs and the referenced canon.

Suggestions

Dedupe the "Distinct from" note (keep it in either the intro blockquote or the footer, not both) and consolidate the two brand-derivation descriptions into one location.

For the five animation patterns and default palette, either keep only a concise summary in SKILL.md with the full canon in the references, or drop the duplicate canon from references — pick one authoritative home to remove the body/bundle overlap.

DimensionReasoningScore

Conciseness

Mostly efficient and skill-specific with executable CSS/JS specs and px/breakpoint values, but contains minor trimmable redundancy — the "Distinct from" note is restated in both the intro blockquote and the footer, and the brand-override derivation is described twice ("Override Pattern" and "Error Handling"). Not a 5 because of these padded spots; not a 3 since the bulk earns its tokens.

4 / 5

Actionability

Fully executable, copy-paste-ready guidance: exact `:root` palette, complete GSAP timeline / mouse-parallax / ScrollTrigger.batch / keyframe snippets, CDN tags, validator invocation (`scripts/html_validator.py --file ...`), and kebab-slug command. Specific examples cover the common generation cases.

5 / 5

Workflow Clarity

Clear dependency-ordered intake sequence (Phase 0 Q1–Q4 with explicit stop condition), followed by content extraction, section specs, and a post-generation validation step with a feedback loop ("html_validator returns FAIL → Regenerate ONLY the failing sections in one targeted pass"), matching the top anchor including error recovery.

5 / 5

Progressive Disclosure

Good structure with well-signaled one-level-deep references (brand_system_design.md, gsap_animation_patterns.md, single_file_html_discipline.md — all verified present) plus a Tooling table mapping scripts. Not a 5 because the five animation patterns and default palette are inlined in SKILL.md while the canon is also in the references, creating mild redundancy/overlap between body and bundle.

4 / 5

Total

18

/

20

Passed

Description

96%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 strong: it states concrete capabilities, gives a rich set of natural trigger phrases, and answers both what and when explicitly. The only gap is that it does not surface the disambiguation against the closely related landing-page-generator skill, which slightly raises conflict risk.

Suggestions

Add a short disambiguation clause to the description noting this skill outputs a single self-contained HTML file (vs. the TSX-component landing-page-generator) to reduce trigger overlap with the sibling skill.

DimensionReasoningScore

Specificity

Lists multiple concrete actions — "Generates a premium single-page HTML landing page with 3D CSS animations, GSAP scroll effects, and mouse-parallax depth", a forcing intake procedure, "Outputs a single self-contained HTML file", and "configurable brand colors via CSS custom property overrides" — giving comprehensive, non-generic coverage.

5 / 5

Completeness

Explicitly answers both "what" ("Generates a premium single-page HTML landing page...") and "when" ("Use whenever the user says...") with concrete trigger phrases, meeting the top anchor.

5 / 5

Trigger Term Quality

Comprehensive natural-term coverage including synonyms and phrasings users actually say — "create a landing page", "build a landing page", "make a landing page for X", "I need a web page for Y", "promotional page", "product page", "one-pager", "web presence", "sales page".

5 / 5

Distinctiveness Conflict Risk

The niche is clearly framed (single self-contained HTML, GSAP-driven premium visuals) with distinct triggers, but generic triggers like "create a landing page" overlap a sibling skill (landing-page-generator, TSX) that the skill itself acknowledges, leaving minor conflict risk; not a 5 because that disambiguation is absent from the description itself.

4 / 5

Total

19

/

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.

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
alirezarezvani/claude-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.