web-design-reviewer

Automate visual inspection and source code fixing of website design issues.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires playwright, pypdfium2, beautifulsoup4, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill automates the process of reviewing and fixing design issues in websites, saving time and improving consistency.

Core Features & Use Cases

  • Visual Inspection: Identifies layout, responsive, accessibility, and visual consistency issues.
  • Source Code Fixing: Automatically applies fixes to the source code for identified issues.
  • Use Case: Ideal for web developers and designers who need to ensure the quality of their web applications without manual inspection.

Quick Start

Run the 'web-design-reviewer' skill with the URL of the website you want to review.

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 website design review and fix layout issues?

Automating website design review involves using browser automation to capture screenshots and retrieve the DOM, identifying visual inconsistencies, and applying fixes directly to the source code. This Skill handles that process, targeting responsive design and accessibility problems automatically.

Does this website review process require Playwright for browser automation?

Yes, this website review process requires Playwright for browser automation. It uses Playwright to navigate websites, capture screenshots, and retrieve the DOM. It also relies on beautifulsoup4 and pypdfium2 to process the retrieved source code and assets during design inspection.

Can I use this to fix accessibility and responsive design issues automatically?

Yes, you can use this to fix accessibility and responsive design issues automatically. The visual inspection mechanism identifies these specific problems along with layout inconsistencies, and then the tool automatically applies the necessary corrections directly to your website source code.

What is the best way to inspect visual consistency in web applications without manual checking?

The best way to inspect visual consistency without manual checking is automating visual inspection using browser navigation and DOM retrieval. This approach identifies responsive and accessibility issues programmatically, ensuring web application quality while saving the time required for manual design reviews.

How do I review a website's design by just providing a URL?

To review a website's design by URL, run the skill with the target website link. It will automatically launch browser automation to navigate the page, inspect the visual layout and accessibility, and generate the required source code fixes for any identified issues.