Frontend Design Review
Helps with frontend development, design, code review as part of building frontend UIs and user experiences workflows.
Install on your platform
We auto-selected Claude Code based on this skill’s supported platforms.
Run in terminal (recommended)
claude mcp add petbrains-frontend-design-review npx -- -y @trustedskills/petbrains-frontend-design-review
Or manually add to ~/.claude/settings.json
{
"mcpServers": {
"petbrains-frontend-design-review": {
"command": "npx",
"args": [
"-y",
"@trustedskills/petbrains-frontend-design-review"
]
}
}
}Requires Claude Code (claude CLI). Run claude --version to verify your install.
About This Skill
What it does
This skill provides design review capabilities for frontend projects. It assesses user interface (UI) and user experience (UX) aspects, offering feedback on visual consistency, accessibility, and overall usability. The tool aims to improve the quality of frontend designs before implementation.
When to use it
- Early-stage design validation: Get initial feedback on wireframes or mockups.
- Usability assessment: Evaluate existing designs for ease of use and intuitiveness.
- Accessibility review: Ensure designs adhere to accessibility guidelines (e.g., WCAG).
- Visual consistency check: Verify that UI elements align with brand standards and design systems.
Key capabilities
- UI/UX Assessment
- Accessibility Review
- Visual Consistency Checks
Example prompts
- "Review this Figma link for usability issues."
- "Assess the accessibility of this design mockup, focusing on color contrast."
- "Check if these UI elements are consistent with our brand guidelines."
Tips & gotchas
The skill's effectiveness depends on providing clear and complete design assets (e.g., Figma links, image files). Ensure that any relevant style guides or branding documents are accessible for context.
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.