Web Design Reviewer

Web Design Reviewer enables developers to visually inspect websites running locally or remotely, identify design issues like responsive layout problems and accessibility failures, and fix them directly at the source code level. The skill automatically detects project frameworks and styling methods, then performs a multi-step inspection workflow that includes visual analysis, issue identification, code-level fixes, and re-verification. It supports static sites, SPAs, full-stack frameworks, and CMS platforms, making it useful for developers who need to validate and repair design quality across various web application types.

install copies · 90 days. Times the install command was copied on this site in the last 90 days, bots filtered.: 11
skills.sh installs: 14.3K
GitHub stars: 41K
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add github/awesome-copilot --skill web-design-reviewer --agent claude-code

Installs into .claude/skills of the current project.

Files

Web Design Reviewer

This skill enables visual inspection and validation of website design quality, identifying and fixing issues at the source code level.

Scope of Application

Static sites (HTML/CSS/JS)
SPA frameworks such as React / Vue / Angular / Svelte
Full-stack frameworks such as Next.js / Nuxt / SvelteKit
CMS platforms such as WordPress / Drupal
Any other web application

Prerequisites

Required

Target website must be running
- Local development server (e.g., http://localhost:3000)
- Staging environment
- Production environment (for read-only reviews)
Browser automation must be available
- Screenshot capture
- Page navigation
- DOM information retrieval
Access to source code (when making fixes)
- Project must exist within the workspace

Workflow Overview

flowchart TD
    A[Step 1: Information Gathering] --> B[Step 2: Visual Inspection]
    B --> C[Step 3: Issue Fixing]
    C --> D[Step 4: Re-verification]
    D --> E{Issues Remaining?}
    E -->|Yes| B
    E -->|No| F[Completion Report]