skills.rest
Ansteorra
AnsteorraOFFICIAL
Explore all skills by this author →
WebsiteGitHub

web-design-reviewer

Inspect website design issues and apply source-level fixes with Playwright.

6|8|Updated Apr 22, 2023
Search Tags:#accessibility#responsive design#web design#frontend development#code fixing#UI review
One-click install
npx skills add https://github.com/Ansteorra/KMP --skill web-design-reviewer-ansteorra
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-reviewer
Source: https://github.com/Ansteorra/KMP/tree/main/.github/skills/web-design-reviewer
Command: npx skills add https://github.com/Ansteorra/KMP --skill web-design-reviewer-ansteorra

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This skill automates the visual inspection of websites to identify and fix design issues, improving user experience and accessibility.

Core Features & Use Cases

  • Visual Inspection: Detects layout, responsiveness, accessibility, and consistency problems.
  • Automated Fixing: Modifies source code to resolve identified design issues.
  • Use Case: Review a staging website for a new e-commerce product launch, identify and fix layout bugs on mobile devices, and ensure consistent branding before going live.

Quick Start

Review the website at http://localhost:3000 for any design problems.

Frequently Asked Questions about web-design-reviewer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I find and fix responsive web design issues automatically?▼

To fix responsive web design issues automatically, you need a tool that performs visual inspection using browser automation and applies source-level corrections to the underlying frontend code.

How do I check my website for accessibility and layout problems?▼

You can check website accessibility and layout problems through automated visual inspection, which detects inconsistencies across the DOM and modifies the source code to resolve them.

Does web design review work with Playwright for UI inspection?▼

Yes, web design review requires browser automation tools like Playwright to navigate, screenshot, and inspect the DOM, enabling accurate detection of frontend visual and accessibility issues.

What's the best way to automate UI review and code fixing for frontend development?▼

The best way to automate UI review and code fixing is using an advanced tool that combines DOM inspection with code search capabilities to identify design flaws and apply targeted source-level corrections.

Can I fix website design flaws across different frontend frameworks?▼

Yes, you can fix website design flaws across various frameworks and styling methods by detecting layout and responsiveness problems, then applying automated source-level corrections to the codebase.

Related Skills

Explore More Design & Creative Skills→
GabeujinGabeujin

web-design-reviewer

Inspect website screenshots and DOM structure to fix design issues.

Community
Advanced
VidyaBodepudiVidyaBodepudi
2

browser-testing-with-devtools

Inspect frontend UI rendering, responsiveness, and accessibility with browser DevTools.

Community
Intermediate
NolanPicNolanPic

Frontend Components

Enforce frontend component coding standards in Claude Code workflows.

Community
Basic
githubgithub
37.6k

web-design-reviewer

Inspect web interfaces for layout, accessibility, and visual consistency issues.

Official
Intermediate