<Purpose Use this skill to compare generated UI screenshots against one or more reference images and return a strict JSON verdict that can drive the next edit iteration. </Purpose <Use When The task includes visual fidelity requirements (layout, spacing, typography, component styling) You have a generated screenshot and at least one reference image You need deterministic pass/fail guidance before continuing edits </Use When <Inputs reference images[] (one or more image paths) generated screenshot (current output image) Optional: category hint (e.g., hackernews , sns feed , dashboard ) </Inputs <Output Contract Return JSON only with this exact shape: Rules: score : integer 0 100 verdict : short status ( pass , revise , or fail ) category match : true when the generated screenshot matches the intended UI category/style differences[] : concrete visual mismatches (layout, spacing, typography, colors, hierarchy) suggestions[] : actionable next edits tied to the differences reasoning : 1 2 sentence summary <Threshold And Loop Target pass threshold is 90+ . If score < 90 , continue editing and rerun /oh my claudecode:visual verdict before any further visual review pass. Do not treat the visual task as complete until the next screenshot clears the threshold. </Threshold And Loop <Debug Visualization When mismatch diagnosis is hard: 1. Keep $visual verdict as the authoritative decision. 2. Use pixel level diff tooling (pixel diff / pixelmatch overlay) as a secondary debug aid to localize hotspots. 3. Convert pixel diff hotspots into concrete differences[] and suggestions[] updates. </Debug Visualization <Example </Example Task: {{ARGUMENTS}}

visual-verdict