skills.rest
louisburroughs
louisburroughsCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-reviewer

Automate visual inspection of websites to detect responsive, accessibility, and visual consistency issues.

Updated Dec 14, 2025
Search Tags:#accessibility#responsive#web-design#browser-automation#visual-review#ui-audit
One-click install
npx skills add https://github.com/louisburroughs/durion --skill web-design-reviewer-louisburroughs
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-reviewer
Source: https://github.com/louisburroughs/durion/tree/main/.github/skills/web-design-reviewer
Command: npx skills add https://github.com/louisburroughs/durion --skill web-design-reviewer-louisburroughs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill enables rapid visual assessment of website design quality, catching layout problems, accessibility gaps, and responsive issues that slow down development and degrade user experience.

Core Features & Use Cases

  • Automated visual inspection: detect responsive breakpoints, accessibility contrast issues, and UI inconsistencies across pages.
  • Source-level fixes: generate actionable changes to the codebase to address design problems at their source.
  • Use Case: QA teams can run a design-review pass on a local or staging site and receive a prioritized list of fixes with suggested code changes.

Quick Start

  1. Run the web-design-reviewer against a running site (local or staging) and review the suggested fixes.
  2. Apply the changes to the repository and re-check with the reviewer to verify improvements.

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 of my website to identify responsive and accessibility issues?▼

Automated visual inspection uses browser automation to capture screenshots and DOM data, analyzing your website to detect responsive breakpoints, accessibility contrast gaps, and UI inconsistencies across pages.

Can I audit design defects in a React or Next.js single page application?▼

Yes, visual UI audits support SPAs including React, Vue, Angular, Next.js, Nuxt, and SvelteKit apps, analyzing the rendered output to catch layout problems and visual consistency issues.

How do I generate source-level fixes for accessibility contrast and layout problems?▼

Source-level fixes are generated by analyzing the workspace source code and DOM data, then producing actionable code changes to modify scripts, references, and assets in your project directories.

Does automated web design review work with WordPress and other CMS platforms?▼

Yes, automated web design review works with CMS platforms like WordPress, analyzing rendered pages for visual consistency, responsive breakpoints, and accessibility gaps to suggest targeted fixes.

What's the best way to run a design review pass on a local staging site?▼

Run the reviewer against your running local or staging site to capture screenshots and DOM data, review the prioritized list of suggested fixes, apply changes to the repository, and re-check to verify improvements.

Related Skills

Explore More Design & Creative Skills→
forgivesam168forgivesam168
2

web-design-reviewer

Inspect websites visually and diagnose design issues across frameworks.

Community
Advanced
Shaarav4795Shaarav4795

web-design-reviewer

Inspect websites visually and fix responsive, accessibility, and layout issues in source code.

Community
Intermediate
pradyumnasagarpradyumnasagar
6

agent-handoff

Automate inter-skill data transfer and provenance capture via JSON Material Passports.

Community
Advanced
webmaxruwebmaxru

web-design-reviewer

Detect and fix visual, responsive, accessibility, and layout issues in web applications.

Community
Advanced