progressive-blur

Create a layered CSS progressive blur (top or bottom) using multiple backdrop-filter masks for depth and softness. Use when asked for “progressive blur”, “gradient blur overlay”, or stepped blur masks that fade from an edge of the viewport.

Quality

87%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

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 highly actionable, well-organized skill body with copy-paste-ready code and clear guidance. The main token-efficiency concern is the near-duplicate top/bottom code blocks, which the existing customization knobs already make partially redundant.

Suggestions

Replace the second full code block with a note like 'Same as top blur but flip `to top` to `to bottom` and set `inset: auto 0 0 0` with a larger height' to remove the ~90 lines of duplication.

If both full snippets are kept for copy-paste convenience, move one to a reference file and link it, preserving the lean overview in SKILL.md.

Dimension	Reasoning	Score
Conciseness	The prose is lean and avoids explaining concepts Claude already knows, but the top and bottom code blocks (~90 lines) are near-complete duplicates, and the 'Customization knobs' section already notes 'Direction: flip to top <-> to bottom', so the second full block is largely redundant and could be tightened.	2 / 3
Actionability	Two complete, copy-paste-ready HTML/CSS snippets plus concrete 'Customization knobs' and 'Common pitfalls' give fully executable, specific guidance.	3 / 3
Workflow Clarity	This simple single-purpose skill has an unambiguous 3-step workflow (confirm placement, provide snippet and checklist, offer targeted tweaks) plus a spec-gathering checklist; no destructive or batch operations require validation checkpoints.	3 / 3
Progressive Disclosure	No bundle files exist, and the self-contained body is organized into clearly labeled sections (Workflow, checklist, snippets, knobs, pitfalls) with no need for external references.	3 / 3
	Total	11 / 12 Passed

Description

90%

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 concise, well-targeted description that clearly states the capability and provides explicit, natural-sounding triggers. Its only weakness is that it names a single concrete action rather than enumerating several, which leaves specificity just below the top anchor.

Suggestions

Optionally enumerate a second concrete action (e.g., 'tune blur strength and step count') to push specificity to the top anchor.

Dimension	Reasoning	Score
Specificity	The phrase 'Create a layered CSS progressive blur (top or bottom) using multiple backdrop-filter masks' names the domain and mechanism concretely, but it describes a single action rather than listing multiple specific concrete actions like the anchor-3 example.	2 / 3
Completeness	It states what it does ('Create a layered CSS progressive blur...') and gives an explicit 'Use when...' clause covering multiple trigger phrasings, answering both what and when.	3 / 3
Trigger Term Quality	'progressive blur', 'gradient blur overlay', and 'stepped blur masks that fade from an edge of the viewport' are natural terms a user would actually say when requesting this effect.	3 / 3
Distinctiveness Conflict Risk	The niche (CSS progressive/stepped blur via backdrop-filter masks) is narrow with distinct, specific triggers unlikely to overlap with other skills.	3 / 3
	Total	11 / 12 Passed

Validation

100%

Warnings & errors only

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
Path: agent-skills/web-design/progressive-blur/SKILL.md
Commit: 46abf78

Reviewed: about 5 hours ago

Table of Contents

Discovery Implementation Validation

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.