---
name: visual-rendering-audit
description: Capture screenshots at multiple viewports and check above-the-fold content, mobile responsiveness, and visual layout issues.
---

# Visual Rendering Audit

## Use this when

visual audit, mobile rendering, above the fold, responsive check, screenshot test.

## Process

Use Brainwrite's built-in Browser capability to render the page and capture screenshots at a spread of viewport widths — desktop (around 1920x1080), laptop (around 1366x768), tablet (around 768x1024), and mobile (around 375x812) — rather than assuming a single viewport represents the real experience.

Above-the-fold check at each viewport: is the primary H1 visible without scrolling; is the main CTA visible without scrolling; does the hero content load without a visible layout shift.

Mobile responsiveness check: is navigation accessible (a real hamburger menu or a visible nav, not hidden entirely); are touch targets at least 48x48px with adequate spacing; is there any horizontal scroll (there shouldn't be); is body text readable at 16px or larger without the user needing to zoom.

Visual issue check: overlapping elements, text that's cut off or overflowing its container, images not scaling correctly at narrow widths, layout that breaks at any of the tested widths.

Report a summary per viewport (screenshot reference, above-the-fold verdict, issues found) and a consolidated mobile-responsiveness assessment. This is a real capability via Brainwrite's Browser tool, not a substitute for it — don't claim Playwright specifically, since the underlying mechanism is Brainwrite's own browser engine.