# claude-code-ui

> claude-code-ui is a free, open-source (MIT) web UI and GUI for Claude Code. A small local daemon runs Claude Code sessions on your own machine; you run, watch and steer many of them from any browser, including your phone. No cloud, no relay, no telemetry. Unofficial; not affiliated with Anthropic.

- Run: `npx claude-code-ui` (or `npm i -g claude-code-ui`; the command is `claude-ui`). Needs Node.js 22+ and Claude Code logged in (`claude login`); uses the Claude subscription, no API key.
- Source: https://github.com/cuonghuunguyen/claude-code-ui (npm package `claude-code-ui`).
- Not the same project as CloudCLI (also called "Claude Code UI", repo siteboon/claudecodeui), opcode or claude-code-webui.

## Table of Contents

### Getting started

- [Install & first run](https://cuonghuunguyen.github.io/claude-code-ui/guide/install.md): claude-code-ui runs a small local server (the daemon) on your computer. You open its web page in a browser.
- [A quick tour](https://cuonghuunguyen.github.io/claude-code-ui/guide/tour.md): The screen has four parts. Each links to its own page.
- [FAQ](https://cuonghuunguyen.github.io/claude-code-ui/guide/faq.md): Short answers about claude-code-ui, the open-source web UI for Claude Code. What it is, what it needs, phone use, parallel sessions, cost, privacy and how it differs from similarly named projects.
- [How it compares](https://cuonghuunguyen.github.io/claude-code-ui/guide/compare.md): How claude-code-ui compares with the Claude Code CLI, Anthropic's own apps and other community UIs for Claude Code (CloudCLI / claudecodeui, opcode, claude-code-webui), and when to pick which.

### Working in a session

- [The prompt box](https://cuonghuunguyen.github.io/claude-code-ui/features/prompt-box.md): The box at the bottom of a session. You type prompts here, and pick the model, mode and effort.
- [Permissions & modes](https://cuonghuunguyen.github.io/claude-code-ui/features/permissions.md): Before Claude runs a tool (a command, a file edit), it may ask you. This works exactly like Claude Code, with the same rules.
- [Reading a session](https://cuonghuunguyen.github.io/claude-code-ui/features/timeline.md): The middle of the screen is the timeline: your prompts, Claude's answers and everything Claude did, newest at the bottom.
- [Usage & context](https://cuonghuunguyen.github.io/claude-code-ui/features/usage.md): Two small meters show how much you have left.
- [Ask an aside (/btw)](https://cuonghuunguyen.github.io/claude-code-ui/features/aside.md): Ask a side question about a session without touching it. An aside is a copy of the session that knows everything up to now. It answers in a floating popup…
- [Background shells](https://cuonghuunguyen.github.io/claude-code-ui/features/background-shells.md): A shell command can run in the background: the turn goes on, the command keeps running, and its end is reported to Claude.

### Many sessions

- [Projects & worktrees](https://cuonghuunguyen.github.io/claude-code-ui/features/projects.md): A project is a folder you work in. New sessions start in a project.
- [Focus page](https://cuonghuunguyen.github.io/claude-code-ui/features/focus.md): One page that shows, per session, what needs you, what is working and what finished while you were away. Requests are answered right there.
- [Notifications](https://cuonghuunguyen.github.io/claude-code-ui/features/notifications.md): claude-code-ui tells you when a session needs input or finishes. There are three kinds.
- [Orchestration (workers)](https://cuonghuunguyen.github.io/claude-code-ui/features/orchestration.md): One session (the coordinator) can start and steer other sessions (the workers). Off by default.

### Workspace & layout

- [Sessions & tabs](https://cuonghuunguyen.github.io/claude-code-ui/features/sessions.md): A session is one conversation with Claude in one folder. Sessions run in the daemon, so they keep going when you close the browser.
- [Panes & layout](https://cuonghuunguyen.github.io/claude-code-ui/features/panes.md): Changes, Files, Git graph, Terminal, Plan and Artifacts are panes. Each one is a tab of the side panel, of the bottom panel or (except Changes) of the main…
- [Split view](https://cuonghuunguyen.github.io/claude-code-ui/features/split-view.md): Show two sessions next to each other, or one above the other, each with its own timeline, prompt box and scroll position. A session can also sit beside one…
- [Context menus](https://cuonghuunguyen.github.io/claude-code-ui/features/context-menus.md): Right-click (or long press, or Shift+F10 on the focused row) a project, worktree, worker, session or tab for its actions.
- [Clean up](https://cuonghuunguyen.github.io/claude-code-ui/features/clean-up.md): Close or remove many tabs, worktrees and workers at once, with a safety check for each.
- [Command palette](https://cuonghuunguyen.github.io/claude-code-ui/features/palette.md): One search box for commands, sessions, files and message text.
- [Keep screen awake](https://cuonghuunguyen.github.io/claude-code-ui/features/keep-awake.md): Stops the screen from turning off while claude-ui is open, so you can watch a long session run.

### Code & git

- [Files](https://cuonghuunguyen.github.io/claude-code-ui/features/files.md): The Files pane: a file tree and a simple editor for the session's folder. It lives in the side panel by default; it can also be a tab in the main area (see…
- [Changes & diffs](https://cuonghuunguyen.github.io/claude-code-ui/features/changes.md): The Changes pane shows what changed, as diffs, file by file.
- [Git graph](https://cuonghuunguyen.github.io/claude-code-ui/features/git-graph.md): The Graph pane shows the project's commit history as a graph, like git log --graph. It is read-only, except Fetch. It lives in the side panel by default and…
- [Terminal](https://cuonghuunguyen.github.io/claude-code-ui/features/terminal.md): A real terminal in the session's folder, docked at the bottom of the window by default. It can also sit in the side panel or as a tab in the main area. It…

### Setup & access

- [Phone & remote access](https://cuonghuunguyen.github.io/claude-code-ui/features/remote-access.md): By default only your own computer can open claude-code-ui. To use it from your phone or another computer, pick one way:
- [WSL, Docker & SSH](https://cuonghuunguyen.github.io/claude-code-ui/features/wsl-docker.md): One claude-code-ui can also run sessions inside your WSL distros (on Windows), inside running Docker containers and on machines you reach over SSH. Each of…
- [MCP, skills & plugins](https://cuonghuunguyen.github.io/claude-code-ui/features/config-dialogs.md): Three dialogs manage Claude Code's MCP servers, skills and plugins, the same way the VS Code extension does. Changes are saved to Claude Code's own config…
- [Addons](https://cuonghuunguyen.github.io/claude-code-ui/features/addons.md): An addon changes how claude-ui looks and what it offers in the browser: colour themes, panes next to the chat, a band above the prompt box, slash commands…
- [Inline visualizations](https://cuonghuunguyen.github.io/claude-code-ui/features/visualize.md): Claude can draw a chart, a diagram or a small interactive widget right in its reply.
- [Updates](https://cuonghuunguyen.github.io/claude-code-ui/features/updates.md): claude-code-ui checks npm for a new version when it starts and once a day, and can update itself.

### Reference

- [Keyboard shortcuts](https://cuonghuunguyen.github.io/claude-code-ui/reference/shortcuts.md): Shortcuts work anywhere in the app, including the prompt box, except as noted under Good to know.
- [Settings](https://cuonghuunguyen.github.io/claude-code-ui/reference/settings.md): Open Settings with Ctrl+, (⌘ , on Mac) or the Settings button at the bottom of the sidebar. Pick a group on the left.
- [CLI flags](https://cuonghuunguyen.github.io/claude-code-ui/reference/cli.md): Example:
- [Troubleshooting & FAQ](https://cuonghuunguyen.github.io/claude-code-ui/reference/troubleshooting.md): Fixes for common claude-code-ui problems (node-pty install errors, pairing, ports, WSL and Docker sides, push, updates) and answers to frequent questions.
- [Privacy](https://cuonghuunguyen.github.io/claude-code-ui/reference/privacy.md): Short version: everything stays on your machine. There is no claude-code-ui server, no account and no telemetry.