CtrlK
BlogDocsLog inGet started
Tessl Logo

reset-css

Use when reviewing stylesheets, component styles, and responsive behavior related to Use a CSS reset or normalize stylesheet. Check the rendered layout across breakpoints and interaction states before proposing a fix.

58

Quality

67%

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/reset-css/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

57%

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

The skill uses good progressive disclosure — a lean overview pointing to a real references/rule.md — but the body restates browser-default concepts across redundant Check/Fix/Explain sections and lacks executable code or a verification loop, limiting conciseness, actionability, and workflow clarity.

Suggestions

Collapse the redundant Check/Fix/Explain sections and drop the opening concept explanation; keep only what Claude does not already know about applying a reset.

Add executable detail: an example import line and a minimal modern-reset CSS snippet, or at least a copy-paste `@import`/`import` statement, so guidance is complete rather than directional.

Add a verification checkpoint to the Code Review flow (e.g., re-check the rendered layout across breakpoints after applying the reset) so the workflow has an explicit validation step.

DimensionReasoningScore

Conciseness

The body is short, but the opening line explains a concept Claude already knows ("CSS resets eliminate browser default inconsistencies—ensuring your designs look identical across Chrome, Firefox, Safari, and Edge") and the Check/Fix/Explain sections each restate "eliminate browser default styling inconsistencies / consistent styling across browsers," creating redundant padding.

2 / 3

Actionability

It offers one concrete command ("pnpm add normalize.css") but the rest is guidance without executable detail — "Import before your custom styles" gives no import snippet, and "Implement a modern CSS reset like normalize.css, CSS remedy, or a custom reset" names options with no example reset block.

2 / 3

Workflow Clarity

Check/Fix/Explain/Code Review are parallel modes rather than a sequenced workflow, and there is no validation checkpoint confirming the reset actually renders consistently before the fix is considered done, leaving the sequence implicit.

2 / 3

Progressive Disclosure

The body is a concise overview that clearly signals a single one-level-deep reference ("see references/rule.md"), and that file exists in the bundle, giving clean navigation without nested references.

3 / 3

Total

9

/

12

Passed

Description

77%

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 covers concrete review actions and includes an explicit "Use when" trigger, but the verbatim rule title awkwardly embedded mid-sentence makes the phrasing read like template stuffing and slightly weakens trigger naturalness and distinctiveness.

Suggestions

Rewrite the description so the rule title is not pasted mid-sentence, e.g. "Reviews stylesheets and component styles for missing CSS reset/normalize rules. Use when auditing responsive CSS, cross-browser consistency, or when the user mentions CSS resets, normalize.css, or browser default styling."

Lead with the capability in third-person process voice ("Reviews...") and keep the "Use when..." trigger as a clean separate clause.

Add common natural trigger variations users would actually say ("CSS reset", "normalize.css", "browser default styles", "cross-browser styling").

DimensionReasoningScore

Specificity

Lists multiple concrete actions — "reviewing stylesheets, component styles, and responsive behavior", "Check the rendered layout across breakpoints and interaction states", and "proposing a fix" — rather than vague language.

3 / 3

Completeness

Explicitly answers both what (review/check reset compliance and propose fixes) and when via the "Use when reviewing stylesheets..." trigger clause, satisfying the explicit-trigger requirement.

3 / 3

Trigger Term Quality

Relevant keywords exist (stylesheets, component styles, responsive behavior, breakpoints, CSS reset, normalize) but the verbatim rule title is awkwardly embedded ("related to Use a CSS reset or normalize stylesheet") and "interaction states" is jargon, so phrasing reads templated rather than natural.

2 / 3

Distinctiveness Conflict Risk

The CSS-reset niche narrows it, but "reviewing stylesheets, component styles, and responsive behavior" overlaps broadly with general CSS/frontend review skills, and the muddled construction raises ambiguity.

2 / 3

Total

10

/

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

metadata_version

'metadata.version' is missing

Warning

Total

15

/

16

Passed

Repository
thedaviddias/Front-End-Checklist
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.