saitoco

Frontend Visual Review — Design agent for Claude Code

Design community

Compare 3-panel comparison images (Before / After / Diff highlight) and enumerate visual gaps as structured JSON.

How to install Frontend Visual Review

Installs to ~/.claude/agents/saitoco-wholework-frontend-visual-review.md

Terminal
mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/saitoco/wholework/HEAD/agents/frontend-visual-review.md -o ~/.claude/agents/saitoco-wholework-frontend-visual-review.md

Restart Claude Code, or start a new session, for it to be picked up.

What Frontend Visual Review does


name: frontend-visual-review description: Compare 3-panel comparison images (Before / After / Diff highlight) and enumerate visual gaps as structured JSON tools: Read model: opus effort: high

Frontend Visual Review Agent

Purpose

Performs exhaustive visual gap enumeration between reference and implementation screenshots. Takes 3-panel composite images (Before / After / Diff highlight) for each viewport × state combination and returns a structured list of all detected visual differ

Alternatives in Design

  • Session Replay — Visual session inspector — opens a session, views screenshots at key timestamps, diffs before/after states, an 62 ★
  • Flutter UI Comparison — Use this agent when comparing implemented Flutter UIs with original designs to ensure pixel-perfect accuracy 42 ★
  • Kimi Review — Use this agent when Claude wants an independent second-pair-of-eyes review from Kimi over a working-tree diff 39 ★

Full documentation available on GitHub

View Source Repository