web-design-reviewer

Detect responsive, accessibility, and visual consistency issues in websites.

Updated Jan 23, 2026
One-click install
npx skills add https://github.com/foeria/webblog --skill web-design-reviewer-foeria
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-reviewer
Source: https://github.com/foeria/webblog/tree/main/.github/skills/web-design-reviewer
Command: npx skills add https://github.com/foeria/webblog --skill web-design-reviewer-foeria

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams identify and resolve visual design issues in websites during reviews, saving time and improving UI quality.

Core Features & Use Cases

  • Detects responsive, accessibility, and visual consistency issues
  • Proposes code-level adjustments to CSS/markup
  • Use Case: Review a local Next.js site and fix header alignment across devices.

Quick Start

Launch the reviewer against your running site (e.g., http://localhost:3000). The tool captures screenshots, analyzes layout, accessibility, and visual consistency, and outputs a report with suggested CSS/markup fixes.

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 responsive web design issues during a UI review?

Automated visual review tools detect responsive web design issues by capturing screenshots across device breakpoints, analyzing DOM layout shifts, and outputting actionable CSS or markup fixes to align UI elements.

Can I check website accessibility and visual consistency on a local Next.js development server?

Yes, you can review website accessibility and visual consistency on a local Next.js server by launching a reviewer tool against your localhost URL, which analyzes the rendered DOM to detect and resolve UI compliance problems.

Does web design review work with single page applications built using Vue or Angular?

Yes, web design review works with single page applications built using Vue, Angular, Nuxt, and React by utilizing browser automation to capture screenshots and extract DOM elements for visual layout and accessibility analysis.

Do I need browser automation to detect visual regression and UI inspection problems?

Yes, you need browser automation tools to detect visual regression and perform UI inspection, because the review process requires capturing live screenshots and extracting the DOM structure to analyze layout and accessibility issues accurately.

What is the best way to automate layout fixes for WordPress sites and static sites?

The best way to automate layout fixes for WordPress and static sites is to use a visual review tool that analyzes the rendered page output and proposes specific code-level adjustments to your CSS and markup structure.