Inspector - Visual front-end editor for AI coding agents
Inspector

Edit your front-end, visually

We connected your coding agent to a browser, and built-in a visual editor.

Join Discord
Visual Editor
Move elements visually, edit text, or leave a comment to make changes.
Connect your agent
Connect to your Claude Code, Codex, or Cursor account.
Completely local
Inspector connects to any local codebase
Inspector visual editor interface showing a React component being edited with drag-and-drop functionality and AI coding agent integration
Inspector app icon - Visual front-end editor for AI coding agents
Feature Overview

Inspector just works

A visual layer for your codebase. Click any element, get context, and ship faster with your favorite coding agent.

View changelog
Inspector feature: Switching between AI coding agents including Cursor, Claude Code, and Codex
Expand video

Bring your favorite coding agents

Connect your Claude Code, Cursor, or Codex account in Inspector.

Inspector feature: Drag and drop visual element positioning with automatic code updates
Expand video

Visual editor for your codebase

Move any element, click apply, and have the changes saved to your codebase.

Inspector feature: Click on UI elements to automatically link them to their React component source code
Expand video

Click to add visual context

Inspector links elements to their exact line of code.

Inspector feature: Taking page-aware screenshots that snap to UI elements for AI context
Expand video

Page aware screenshots

Take screenshots that snap to any element on your page.

Inspector feature: Double-click to edit any text on the page and save changes directly to your codebase
Expand video

Edit text

Double click to edit any text on the page and save it to your codebase.

Frequently asked questions

Try Inspector now.

Available for MacOS