Code viewer & editor

Open, read, and edit files inline — without leaving the canvas.

Viewing & editing

Open a file from the tree, search, or git panel. The viewer is powered by CodeMirror with syntax highlighting for TypeScript, JS, Python, Rust, JSON, CSS, HTML, Markdown, and more.

  • Edit inline; ⌘S saves. The header shows modified when you have unsaved changes, with Save / Discard.
  • Jump to a specific line (e.g. from a search result or git diff).
  • Resize the panel by dragging its top edge.

Diff mode

Toggle CODE / DIFF in the header to see the file's git changes — additions and deletions with old/new line numbers, plus a per-hunk Stage Hunk button to stage exactly the changes you want.

CLAUDE.md editor

CodeGrid includes a dedicated editor for your project's CLAUDE.md (and agent instruction files), so you can tune how your agents behave without digging through the tree.

TIP
Press Esc to close the viewer.