skills.rest
angryconsultant
angryconsultantCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-reviewer

Audit running websites for accessibility, responsive behavior, and visual consistency.

Updated Mar 18, 2026
Search Tags:#design#ui#accessibility#frontend#responsive-design#visual-inspection
One-click install
npx skills add https://github.com/angryconsultant/Copilot-CLI --skill web-design-reviewer-angryconsultant
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-reviewer
Source: https://github.com/angryconsultant/Copilot-CLI/tree/main/skills/web-design-reviewer
Command: npx skills add https://github.com/angryconsultant/Copilot-CLI --skill web-design-reviewer-angryconsultant

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Website design quality often hides subtle issues until users encounter them. This skill helps teams quickly identify visual and accessibility problems in locally running or remotely hosted sites, enabling faster, more consistent fixes.

Core Features & Use Cases

  • Visual inspection of UI layout, typography, color contrast, and responsive behavior
  • Accessibility checks including focus states and skip links evaluation
  • Generated reports highlighting issues and suggested guidelines for fixes
  • Use Case: Run on a staging site to surface layout shifts when resizing windows, then create a corrective task list for developers

Quick Start

Run the web-design-reviewer against your site to perform a visual inspection and compile a report of issues.

Frequently Asked Questions about web-design-reviewer

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

FAQPage Schema
How do I check my website for accessibility and responsive design issues?▼

You can identify website accessibility and responsive design issues by running an automated visual inspection that audits live pages for focus states, skip links, layout shifts, and color contrast, then compiles a corrective report.

Can I run a visual inspection on a locally hosted React or Next.js site?▼

Yes, browser automation can navigate and capture screenshots from locally hosted React or Next.js sites, evaluating UI layout and DOM snapshots to find visual consistency problems in local, staging, or production environments.

What is automated visual inspection for web design quality?▼

Automated visual inspection for web design quality is the process of using browser automation to capture screenshots and DOM snapshots, evaluating UI layout, typography, color contrast, and responsive behavior to surface hidden issues before users encounter them.

Does this work with CMS-powered sites like WordPress to find layout shifts?▼

Yes, it works with CMS-powered sites like WordPress by navigating pages via browser automation to detect responsive behavior failures and layout shifts when resizing windows, generating a developer task list.

What is the best way to audit a staging site for visual consistency problems?▼

The best way to audit a staging site for visual consistency problems is running an automated browser navigation tool that captures screenshots and DOM snapshots to evaluate typography, color contrast, and UI layout, producing a report of suggested fixes.

Related Skills

Explore More Design & Creative Skills→
forgivesam168forgivesam168
2

web-design-reviewer

Inspect websites visually and diagnose design issues across frameworks.

Community
Advanced
t-stringst-strings

Frontend Accessibility

Review frontend UI code for HTML semantics, ARIA, keyboard navigation, and contrast.

Official
Basic
ils15ils15
10

frontend-analyzer

Extract typography, colors, layout, spacing, and design tokens from React/Next.js code.

Community
Basic
SPeeDoA1SPeeDoA1
6

accessibility-check

Audit web applications for WCAG compliance and generate remediation checklists.

Community
Basic