Web Design Reviewer

Web Design Reviewer is an official skill from GitHub’s awesome-copilot repository. Its direct primary source is https://github.com/github/awesome-copilot/tree/main/skills/web-design-reviewer. The skill describes a workflow for a coding agent to inspect websites visually, identify concrete design problems, and prepare or apply improvements at source-code level. According to the provider, its scope ranges from static HTML, CSS, and JavaScript sites to React, Vue, Angular, Svelte, Next.js, Nuxt, SvelteKit, WordPress, Drupal, and other web applications.

Purpose and classification

This catalog entry is procedural guidance, not a standalone design scanner, hosting service, or guarantee of a defect-free interface. Its value comes from combining browser navigation, screenshot capture, DOM information, and access to project source code. The agent is expected to understand the target, framework, styling method, and review scope first. It then examines a running local, staging, or production system. Production reviews should generally remain read-only and avoid actions that mutate real state.

Visual review coverage

According to the provider, the workflow examines layout, responsiveness, accessibility, and visual consistency. It covers overflowing or overlapping elements, alignment defects, inconsistent spacing, and clipped text. For mobile views, the source names representative widths of 375 and 768 pixels, with desktop views at 1280 and 1920 pixels. Comparing these states can reveal whether a grid breaks on a small display, whether touch targets are too small, or whether a breakpoint transition feels unnatural. For accessibility, the agent looks at issues such as insufficient contrast, missing visible focus states, and absent alternative text for images.

Workflow and fixes

The workflow starts with information gathering and URL confirmation, then proceeds through visual inspection, prioritized issue fixing, and re-verification. The source recommends minimal changes that respect the existing design system and avoid unnecessary restructuring. For reliable interactions, it recommends robust selectors such as roles or data-testid rather than arbitrary CSS classes. A useful report should identify the affected page, element, impact, and source file changed. After a fix, the agent reloads the page, captures new screenshots, and checks that other pages or viewport sizes were not damaged unintentionally. According to the provider, more than three attempts to fix one specific issue should prompt consultation with the user.

Requirements and boundaries

The target website must be running and reachable through a URL. Visual reviews require browser automation with navigation, screenshots, and DOM retrieval. When fixes are requested, source code must be available in the workspace. The skill does not mandate one framework or one automation library. The official source presents Playwright as a reference implementation and also mentions Selenium, Puppeteer, Cypress, and WebDriver BiDi. This does not imply complete coverage of every browser, device, network condition, or authentication flow. Native mobile applications are outside the described web scope.

Safety and E-E-A-T

Browser actions can submit forms, open external destinations, and capture visible data. Before any side-effecting action, the target environment, scope, and authorization must be clear. Synthetic data and non-production environments are preferable for reproducible reviews. Credentials, tokens, personal information, and confidential screenshots must not be placed in skill files or test artifacts. A local browser process also does not automatically mean that all content remains local when a connected agent sends information to a model provider. This assessment is grounded in the official SKILL.md from github/awesome-copilot, GitHub documentation about Copilot context, and the repository’s official MIT license. It was checked on September 9, 2026. GitHub is verified as the provider, and provider-controlled claims are explicitly attributed as according to the provider.