Responsiveness Check

Test how a website's layout responds to viewport width changes. Resizes through breakpoints in a single browser session, screenshots each width, compares adjacent sizes, and reports where layouts break.

What this tests: Layout responsiveness — overflow, stacking, navigation transitions, content reflow.

What this does NOT test: General accessibility (ARIA, semantic HTML, heading hierarchy, colour contrast). Those don't vary by viewport width — use the ux-audit skill instead.

Browser Tool Priority

Before starting, detect available browser tools:

1. playwright-cli (preferred) — supports resize, named sessions, and sub-agent parallelism. If installed, run /playwright-cli first to load the full command reference.
2. Playwright MCP (mcp__plugin_playwright_playwright__*) — browser_resize for viewport changes.
3. Chrome MCP (mcp__claude-in-chrome__*) — resize_window for viewport changes. Uses the user's logged-in Chrome session.

If none are available, inform the user and suggest installing playwright-cli or Playwright MCP.

Operating Modes