web-design-reviewer

Inspect websites for responsive, accessibility, and visual issues and propose code fixes.

1|Updated Jan 14, 2026
One-click install
npx skills add https://github.com/EmeaAppGbb/spec2cloud-weather-agent --skill web-design-reviewer-emeaappgbb
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-reviewer
Source: https://github.com/EmeaAppGbb/spec2cloud-weather-agent/tree/main/.github/skills/web-design-reviewer
Command: npx skills add https://github.com/EmeaAppGbb/spec2cloud-weather-agent --skill web-design-reviewer-emeaappgbb

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill enables automated visual inspection of websites to identify design problems such as responsive breakage, accessibility gaps, and visual inconsistencies, and it can propose fixes at the source code level.

Core Features & Use Cases

  • Automated visual inspection: Assess layout, responsiveness, accessibility, and visual consistency for static sites and modern web apps.
  • Issue diagnosis & fixes: Detect design problems and propose or apply code-level fixes to the source.
  • Use Case: Imagine reviewing a Next.js site and getting a report with actionable fixes for layout and accessibility.

Quick Start

Use the web-design-reviewer skill to scan a running site at http://localhost:3000 and generate a fix plan.

Frequently Asked Questions about web-design-reviewer

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

FAQPage Schema
How do I automate visual inspection to find responsive design and accessibility issues on my website?

You can scan a running site like http://localhost:3000 to assess layout, responsiveness, and accessibility, generating a report with actionable code-level fixes for visual inconsistencies.

Can I use automated web design review tools with SPA frameworks like React, Vue, and Next.js?

Yes, automated web design review supports SPA frameworks including React, Vue, Angular, Svelte, Next.js, and Nuxt, enabling DOM inspection and layout checks on local, staging, and production environments.

How do I fix accessibility gaps and visual inconsistencies directly at the source code level?

You can diagnose accessibility gaps and visual inconsistencies during inspection, then apply or propose code-level fixes directly to the source code of static sites or modern web apps.

What is the best way to check my website layout for responsive breakage across different environments?

The best way to check for responsive breakage is using browser automation to perform visual inspection and DOM inspection across local, staging, and production environments for static and CMS-driven sites.

Does automated web design review work for CMS-driven sites or only for static sites?

Automated web design review works for both static sites and CMS-driven sites, performing visual inspection and information gathering to detect design problems and propose fixes.