web-design-reviewer

This skill enables visual inspection and validation of website design quality, identifying and fixing issues at the source code level. Target website must be running Browser automation must be available Access to source code (when making fixes) If the URL is not provided, ask the user: Please provide the URL of the website to review (e.g., ) When making fixes, gather the following information: Attempt automatic detection from files in the workspace: Test at the following viewports: Identify source files from problematic elements: Selector-based Search Component-based Search File Pattern Filtering See references/framework-fixes.md for details. Iteration Limit : If more than 3 fix attempts are needed for a specific issue, consult the user Playwright MCP is recommended as the reference implementation for this skill. The same workflow can be implemented with these tools. As long as they provide the necessary capabilities (navigation, screenshot, DOM retrieval), the choice of tool is flexible. - 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 - Target website must be running - Local development server (e.g., ) - Staging environment - Production environment (for read-only reviews) - Browser automation must be available -...