Which AI agents does this loop work with?

Rebuild a page pixel-for-pixel is written for claude-code, codex.

Is this loop safe to run unattended?

This loop is graded B (80/100) by looprepo's automatic safety evaluator, which checks for exit conditions, iteration budgets, verification steps, and scoping before publishing.

Loop/loop Design & UXlow riskintermediatesafety B · 80 Forward Futurepre-dates current gate · under review

Rebuild a page pixel-for-pixel

Capture a real page, build a static mirror and a live version, then repair the weakest fidelity signals until they match.

prompt

→ Claude Code

Point War Loops at an authorized URL or image. Capture it with a genuine browser and record the layout, styles, content, motion, and responsive behavior. Build a static Pencil mirror and a moving Forge version. Compare both with the source at desktop, tablet, and mobile sizes; repair only the weakest fidelity signals. Stop when every gate passes, progress stalls, or capture is blocked. Finish with the builds, spec, renders, scores, and remaining gaps.

claude-code · codex

Use this when

Use War Loops when an authorized interface must be rebuilt from a URL or image and judged on appearance, motion, and responsive behavior.

How it runs

Capture the source with a genuine browser and extract its design spec, motion, and target viewports.
Build the static Pencil mirror and moving Forge version from the verified spec.
Judge both across static design, experiential motion, and responsive reflow.
Repair the weakest signals without rebuilding what already matches, then repeat to a terminal fidelity decision.

Done when

✓ The builds match the source across all three fidelity axes. Static appearance, experiential motion, and responsive reflow pass their gates, or the run reports stagnation or a blocked capture.

Why it works

War Loops separates a page's still appearance from how it moves and reflows. Its surgical critic targets the weakest measured signals without churning areas that already match.

Implementation note

The source implementation uses War Loops with Pencil and Forge. Confirm authorization to reproduce the reference, and stop on a bot wall, login gate, or unreliable capture.

Source: Forward Future ↗graded B · 80/100 — how grades work →

More design loops

Polish page against design brief

Loop/ralphGitHub B

Read the design brief, apply one focused improvement to the current implementation, re-check against all requirements until the brief is fully met.

prompt

→ Claude Code

/ralph-loop "Read the brief at /redesign/briefs/clients-brief.md. Compare the current implementation to the brief's requirements (every section of the brief, including Recipe Context and Implementation Notes). Apply one focused improvement. Re-check against the brief. If all brief requirements are met, output <promise PAGE-POLISH-COMPLETE</promise ." --max-iterations 8 --completion-promise "PAGE-POLISH-COMPLETE

designmedium risk

claude-code

mamdouhmhed-235 ↗

Delete dead CSS, pixel-safe

Loop/loopForward Future B

Remove one unused or redundant style at a time and keep it gone only when every tested screen looks identical.

prompt

→ Claude Code

Reduce the CSS styling code [site] sends to users without changing tested screens. First capture representative pages, sizes, themes, and interactions, and record the built CSS size. Treat coverage reports only as suggestions. Remove one declaration or rule, rebuild, and rerun screenshots and project checks. Keep it only if every screenshot is pixel-identical and built CSS is smaller; otherwise revert. Stop when no supported candidate remains, progress stalls, or approval is required. Return reduction, evidence, and untested states.

designlow risk

claude-code codex

Forward Future ↗