web-design-reviewer

Inspect running websites for design issues and apply source-level fixes.

58|20|Updated Feb 19, 2026
One-click install
npx skills add https://github.com/ABIvan-Tech/copilot-agentic-workflows --skill web-design-reviewer-abivan-tech
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-reviewer
Source: https://github.com/ABIvan-Tech/copilot-agentic-workflows/tree/main/skills/web-design-reviewer
Command: npx skills add https://github.com/ABIvan-Tech/copilot-agentic-workflows --skill web-design-reviewer-abivan-tech

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Quickly identify and fix website design issues by validating UI quality across local and remote environments, reducing layout and accessibility problems earlier in the process.

Core Features & Use Cases

  • Visual inspection of responsive layouts, accessibility conformance, and visual consistency across static sites, SPA frameworks (React, Vue, Angular, Svelte), and full-stack frameworks (Next.js, Nuxt, SvelteKit).
  • Guidance and steps to apply source-code level fixes in CSS, components, and templates with minimal risk.
  • Workflow support for local development servers, staging environments, and production read-only reviews, with automated screenshot capture and DOM inspection.

Quick Start

Run a design review on a running site and apply minimal, source-level fixes to address detected 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 find and fix website responsiveness and accessibility issues in my source code?

To fix website responsiveness and accessibility issues, this Skill performs visual inspection on running sites using browser automation for screenshots and DOM data, then applies minimal source-level fixes directly to your CSS, components, and templates.

Can I run a visual design review on SPA frameworks like React, Vue, Angular, and Svelte?

Yes, you can run a visual design review on SPA frameworks like React, Vue, Angular, and Svelte, as well as full-stack frameworks like Next.js and Nuxt, by automating browser navigation and capturing DOM data to assess visual consistency.

What do I need to automate a design review and apply UI fixes to a running website?

To automate a design review and apply UI fixes, you need browser automation for navigation and screenshots, access to the project source code for implementing fixes, and a running local development server, staging environment, or production URL.

What is the best way to check frontend visual consistency across local and staging environments?

The best way to check frontend visual consistency across local and staging environments is to use automated screenshot capture and DOM inspection on the running site, detecting layout problems earlier in the development process.

Does this approach support read-only design reviews for production environments?

Yes, this approach supports read-only design reviews for production environments by performing visual inspection and capturing screenshots without requiring direct access to modify the production source code.