Svg Icon Best Practice
Ensures SVG icons adhere to accessibility and performance best practices, optimizing size and usability.
Install on your platform
We auto-selected Claude Code based on this skill’s supported platforms.
Run in terminal (recommended)
claude mcp add svg-icon-best-practice npx -- -y @trustedskills/svg-icon-best-practice
Or manually add to ~/.claude/settings.json
{
"mcpServers": {
"svg-icon-best-practice": {
"command": "npx",
"args": [
"-y",
"@trustedskills/svg-icon-best-practice"
]
}
}
}Requires Claude Code (claude CLI). Run claude --version to verify your install.
About This Skill
What it does
This skill provides best practices for working with SVG icons in frontend development. It ensures icons are optimized, accessible, and consistently styled within a project. The skill can help automate tasks related to SVG icon management, reducing manual effort and improving overall code quality.
When to use it
- You need to optimize existing SVG icons for performance (file size reduction).
- You want to ensure your SVG icons are properly accessible (e.g., providing alternative text).
- You're building a new frontend project and want to establish consistent styling for all SVG icons.
- You’re refactoring an older codebase that uses inconsistent or poorly managed SVG icons.
Key capabilities
- SVG icon optimization
- Accessibility improvements (alt text)
- Consistent styling enforcement
Example prompts
- "Optimize these SVG icons for web performance."
- "Add appropriate alt text to all of my SVG icons."
- "Ensure all SVG icons in this project use the same color palette."
Tips & gotchas
This skill likely requires access to your codebase or a set of SVG files. The effectiveness depends on how consistently existing SVG icons are structured and styled.
Tags
TrustedSkills Verification
Unlike other registries that point to live repositories, TrustedSkills pins every skill to a verified commit hash. This protects you from malicious updates — what you install today is exactly what was reviewed and verified.
Security Audits
| Gen Agent Trust Hub | Pass |
| Socket | Pass |
| Snyk | Pass |
🌐 Community
Passed automated security scans.