svg-inline

Use when reviewing image assets, markup, and CDN or build transforms related to Manage inline SVG size and complexity. Check encoded size, rendered size, loading strategy, and above-the-fold impact together.

Quality

67%

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

Fix and improve this skill with Tessl

tessl review fix ./skills/svg-inline/SKILL.md

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 body is a well-structured overview with excellent progressive disclosure to a real reference file, but it is held back by redundant conceptual explanation, no executable code in the body, and missing verification checkpoints in the review workflow.

Suggestions

Trim or remove the 'Explain' section's restatement of inline-SVG trade-offs, which Claude already knows, to improve token efficiency.

Add an explicit verification step to the Check/Fix workflow (e.g., confirm before/after byte counts or DevTools confirmation) so the review loop has a validation checkpoint.

Include at least one executable snippet (e.g., the SVGO command or a size-check command) directly in the body rather than only in the reference.

Dimension	Reasoning	Score
Conciseness	The body is mostly efficient with well-organized sections, but the 'Explain' section re-states inline-SVG trade-offs Claude already knows and the opening paragraph is motivational context that could be trimmed. Not level 3 because of this redundant conceptual material; not level 1 because the bulk is lean and actionable.	2 / 3
Actionability	Concrete guidance is present (1KB threshold, SVGO, extract to .svg, sprites, SVGR), but the body contains no executable code or commands — those are deferred to the reference. Not level 3 because nothing is copy-paste ready in SKILL.md; not level 1 because the instructions are specific rather than vague.	2 / 3
Workflow Clarity	The Check and Fix sections use numbered sequences, but for a batch-scan review task there is no explicit validation or verification checkpoint in the body. Not level 3 because validation/feedback loops are absent; not level 1 because the steps are clearly sequenced.	2 / 3
Progressive Disclosure	SKILL.md is a concise overview with a single, clearly signaled one-level-deep reference ('see references/rule.md'), and that file is confirmed present. Not below 3 because navigation is clean and content is appropriately split.	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 has an explicit trigger clause and lists concrete review actions, but awkwardly embeds the rule title and leans on jargon over natural user terms. Distinctiveness is moderate due to the broad opening phrasing.

Suggestions

Reword to surface 'inline SVG' as a clean natural keyword (e.g., 'Use when reviewing inline SVG size and complexity…') instead of embedding the rule title.

Add common user variations such as 'SVG optimization', 'image weight', or 'above-the-fold rendering' to improve trigger term coverage.

Tighten the opening so the trigger is unmistakably about inline SVG rather than generic image assets, markup, and CDN/build transforms.

Dimension	Reasoning	Score
Specificity	Names multiple concrete actions — 'reviewing image assets, markup, and CDN or build transforms' and 'Check encoded size, rendered size, loading strategy, and above-the-fold impact' — matching the anchor for listing several specific actions.	3 / 3
Completeness	Explicitly answers both what (review/check these aspects) and when via a 'Use when reviewing…' trigger clause, matching the anchor for clearly answering both what and when.	3 / 3
Trigger Term Quality	Terms like 'image assets', 'markup', 'CDN', and 'loading strategy' are relevant but jargon-heavy, and the most direct keyword 'inline SVG' only appears embedded in the rule title rather than as a clean natural trigger. Not level 3 because common user variations ('SVG', 'image optimization', 'inline SVG size') are not cleanly covered; not level 1 because several relevant terms are present.	2 / 3
Distinctiveness Conflict Risk	Tied to a specific named rule, but the opening 'reviewing image assets, markup, and CDN or build transforms' is broad and could overlap with other frontend image or performance skills. Not level 3 because the trigger is not sharply niche; not level 1 because the embedded rule title does narrow the scope.	2 / 3
	Total	10 / 12 Passed

Validation

93%

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 — 15 / 16 Passed

Validation for skill structure

Criteria	Description	Result
metadata_version	'metadata.version' is missing	Warning

	Total	15 / 16 Passed

Repository: thedaviddias/Front-End-Checklist
Path: skills/svg-inline/SKILL.md
Commit: 48405aa

Reviewed: about 7 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.