Inspector

Inspector is a visual front-end editor designed to work directly on your local React, Next.js, or Vite codebase while staying in sync with your AI coding agent (such as Cursor, Claude Code, or Codex). Its primary purpose is to let developers modify UI and copy visually—editing text, moving components, and adjusting layouts—while automatically translating those changes into clean, production-ready code. By bridging the gap between design-like editing and code-centric workflows, Inspector streamlines front-end iteration without sacrificing code quality or version control practices.

Inspector connects to your running dev server and inspects the rendered UI, allowing you to select elements on the page and see the corresponding source files and components. You can edit text content inline, tweak component props, and rearrange layout structures, with changes written back to your local files. Integration with AI coding agents means you can delegate more complex refactors or component updates while still controlling the visual outcome. The tool respects your existing project structure and frameworks, so it fits into established workflows rather than forcing a redesign of your stack.