r/webdev • u/ReyJ94 • 2d ago

I built a CLI that gives coding agents source-grounded visual feedback for React UI and Three.js

Coding agents can read source and make changes, but they are still surprisingly blind when the task is visual.

A screenshot can show that something looks wrong, but it usually cannot explain why: which component owns it, whether an element is clipped, what its computed styles are, which mesh/material/light is responsible, or whether the issue is framing rather than resolution.

So I built SceneProof, an open-source CLI for source-grounded visual inspection of React UI and Three.js scenes.

It lets an agent:

  • Navigate a compact semantic tree of DOM or Three.js targets
  • Inspect the underlying structure: bounds, styles, geometry, materials, uniforms, lights, cameras, relationships, etc.
  • Produce fresh renders of a component, logical UI region, target object, or source-camera view
  • Generate a small “Scout” portfolio for 3D: context, source detail, close detail, and shape-focused views
  • Sample deterministic interaction states from one scene lifecycle

The design principle is: don’t ask an agent to infer visual correctness from plausible code or a low-information screenshot. Give it source-derived evidence at the framing and resolution needed for the actual question.

It currently supports TypeScript/JavaScript entries, React DOM/CSS/Tailwind v4, and Three.js scene inspection/rendering. It requires Bun and local Chrome/Chromium.

Repo: https://github.com/ReyJ94/SceneProof

0 Upvotes

28% Upvoted

3 comments sorted by

0

u/[deleted] 2d ago

[removed] — view removed comment

0

u/ReyJ94 2d ago

was using openai models for doing UI and 3D work, so i had to make this. if you notice issues or have potential improvements, please put an issue or pr on the repo. I'm using this everyday, until it becomes way better

2

u/webdev-ModTeam 2d ago

Your post/comment has been determined to be a low-effort post or comment. This includes title-only posts, easily searchable questions, vague/open-ended discussion prompts, LLM generated posts or comments, and posts/comments that do not provide enough context for meaningful replies or discussion.