CtrlK
BlogDocsLog inGet started
Tessl Logo

masked-reveal

Create masked staggered word reveals on scroll with GSAP ScrollTrigger. Use when headings, hero copy, section titles, or editorial text should reveal word-by-word through an overflow mask as they enter the viewport.

74

Quality

93%

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

SKILL.md
Quality
Evals
Security

Quality

Content

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

An exemplary single-file skill body: lean, fully executable, and complete with accessibility and reduced-motion handling, plus a verification checklist. Its only structural note is size — at ~150 lines with no bundle files, it sits above the simple-skill threshold that would justify a top progressive-disclosure score.

Suggestions

If the skill grows further (e.g., variants like letter-stagger or line-mask reveals), split the CSS mask styles and the React/SPA cleanup guidance into a references/ file and link them from a short overview section.

Add a brief pointer line at the top of the GSAP section (e.g., where to get ScrollTrigger or how to load it) so the executable snippet is self-sufficient for projects not already using GSAP.

DimensionReasoningScore

Conciseness

Every section earns its place — a compact defaults table, working code, taste rules, and a checks list — with zero explanation of concepts Claude already knows; even the one prose line ("avoids the paid SplitText plugin and keeps spaces intact") is exactly the non-obvious knowledge worth tokens. Nothing to trim.

5 / 5

Actionability

Fully executable, copy-paste-ready guidance: complete HTML, CSS, and JS (real escapeHTML, split, and init functions with concrete GSAP defaults) plus a React cleanup pattern using gsap.context and revert(). The code covers the common cases end-to-end.

5 / 5

Workflow Clarity

A single-purpose skill whose action is unambiguous, matching the simple-skill exception; the "Quick Checks" section functions as an explicit validation checklist (hidden-before-init, aria-label for screen readers, preserved spaces, reduced-motion fallback, SPA cleanup). No destructive or batch operations, so no validation cap applies.

5 / 5

Progressive Disclosure

Sections are well organized and all content is appropriately inline for a self-contained animation helper, with no buried references or content that clearly belongs in a separate file. Not 5 because the body is ~150 lines — above the under-50-line threshold under which a no-reference skill can score 5 — and it offers no navigation to deeper material.

4 / 5

Total

19

/

20

Passed

Description

87%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 strong description: it states a concrete capability and mechanism, and pairs it with an explicit 'Use when' clause naming the exact text contexts (headings, hero copy, section titles, editorial text) where the effect applies. The only gaps are a few natural synonym phrasings users might use instead.

DimensionReasoningScore

Specificity

Names the domain and concrete mechanism — "Create masked staggered word reveals on scroll with GSAP ScrollTrigger" and "reveal word-by-word through an overflow mask as they enter the viewport" — giving several specific details with only minor coverage gaps. Not 5 because it describes essentially one action (creating the reveal) rather than the multiple distinct actions of the top anchor.

4 / 5

Completeness

Explicitly answers both: what ("Create masked staggered word reveals on scroll with GSAP ScrollTrigger") and when ("Use when headings, hero copy, section titles, or editorial text should reveal word-by-word through an overflow mask as they enter the viewport") with concrete trigger phrases, matching the top anchor.

5 / 5

Trigger Term Quality

Includes natural phrases users would say — "headings", "hero copy", "section titles", "editorial text", "reveal word-by-word", "on scroll" — plus the technical trigger "GSAP ScrollTrigger". Not 5 because common variations like "text animation", "scroll animation", or "headline animation" are absent.

4 / 5

Distinctiveness Conflict Risk

Occupies a clear niche — masked, scroll-triggered word-by-word reveals via GSAP ScrollTrigger — with distinct trigger language and minimal overlap risk with other skills.

5 / 5

Total

18

/

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.