claude-web
by ypyik0669
A GUI workbench for Claude Code and other CLI agents · Claude Code 的可视化工作台（网页 + 桌面），也能驱动 Codex / Gemini CLI / Qwen / OpenCode 等 CLI agent
50stars
11forks
TypeScript
Added 10/24/2026
Available after the catalog security scan passes.
⚠️ Third-Party Software Notice
This skill is third-party open-source software developed and hosted independently on GitHub. SkillsLLM is an informational directory and does not control or maintain the underlying repository.
Any security checks, ratings, or warnings displayed by SkillsLLM are automated and limited in scope. They do not constitute a security certification or guarantee that the software is safe, error-free, or free from malicious code, vulnerabilities, compromised dependencies, or prompt-injection risks.
Review the source code, permissions, dependencies, and configuration before installing or running any third-party skill. Use is at your own risk. To the maximum extent permitted by applicable law, SkillsLLM is not liable for losses arising from third-party software.
The deep catalog scan for this skill is still queued. Run an instant dependency check now instead.
Maintainer of this skill?
Installation
# Add to your Claude Code skills
git clone https://github.com/ypyik0669/claude-webGetting Started
Guides for using ai agents skills like claude-web.
- Caveman: Cut Claude Token Use by 65%How agent-side prompt compression works, when to use it, and when not to.
- What is an AI Skills Marketplace?Definitions, how marketplaces work, and how to choose between them in 2026.
- Getting Started with AI SkillsFirst-time install walkthrough for Claude Code, Codex CLI, and ChatGPT.
Compare with similar skills
See how claude-web compares with popular alternatives.
Claude Web
English · 简体中文
A visual workbench for the Claude Code CLI. It takes Claude Code out of the command line and puts it in a graphical interface: conversations, tool calls folded into one line per turn, code diff review, permission approvals, files / Git / editor, split view, and remote access from your phone, all in one window.
The same program comes in two forms: a desktop app (Windows / macOS) and a web version (run a local server and open it in your browser). The features are identical and the data is shared. Besides Claude Code, the same interface can drive other CLI agents such as Codex, Gemini CLI, Qwen Code, Kimi and OpenCode. The interface comes in English and Chinese and follows your computer's language by default (how to change it).
Unofficial project. Claude Web is a community-built open-source tool. It has no affiliation with Anthropic and is not endorsed by Anthropic. "Claude" and "Claude Code" are trademarks of Anthropic. To use it you need your own Claude Code login (a Claude subscription) or a key for a third-party API / relay (a third-party API reseller or proxy service). Costs and usage are billed to your own account.
When subagents and workflows run, you can watch them in the pixel-art Internet Café on the "Background" page: your main conversation is the admin at the front desk, and every subagent is a guest. They boot up a PC, type code, wander off for instant noodles and games when idle, and check out at the front desk when they're done (details).
Table of contents
- What it does
- Desktop app or web version?
- Install
- Walkthrough
- 1. Sign in to Claude
- 2. Pick a project and start your first conversation
- 3. Permission prompts and permission modes
- 4. Review changes, Git, files: the right panel
- 5. The split-view workbench
- 6. Connect a third-party API / relay
- 7. Manage several conversations at once
- 8. Use it from your phone
- 9. Other CLI agents (Codex / Gemini …)
- 10. Conversations from other agents on this computer
- 11. Model gateway (multi-account failover / protocol conversion)
- 12. Config for other agents (MCP / instruction files / models)
- 13. Conversations on other computers
- 14. Automation: scheduled tasks, goals, multi-agent orchestration
- 15. Background: watch subagents work in the café
- Character themes
- Interface language
- Custom styles (custom.css)
- Keyboard shortcuts
- Where your data lives
- FAQ
- How it works
- Security and privacy
- Running from source and development
- Contributing
- License and credits
What it does
| Conversations | Streaming output and thinking; a finished turn folds into one line like "Worked for 27 s · Read 2 files · Ran 1 command", and opening it shows a step-by-step timeline; Markdown / code highlighting / math / Mermaid diagrams |
| Code changes | A "Changed N files" card at the end of each turn; the Review tab in the right panel shows each file's diff (unified or side by side), and lets you stage, revert and commit |
| Permissions | When approval is needed, a card sits above the input box: Allow once (press Enter with the box empty) / Deny (whatever you've typed in the box becomes the reason) / Always allow; questions and plan approvals show up here too |
| Workbench | By default you only see the sidebar, the conversation and the right panel. When you need more: Ctrl+D to split (up to 6), tabs, groups; conversations, the editor (Monaco), diffs, terminals and the built-in browser can all go into a split |
| Files / Git / search | File tree, project-wide search and replace (ripgrep), Git stage / commit / branches / stash / worktree, Issue and PR boards |
| Managing conversations | Pin, archive, fork (start a new branch from any message), edit and resend, interject, export to HTML |
| Needs you | The top of the sidebar lists every conversation waiting for you to approve or answer; the Overview groups them into "Needs you / Running / Error / Idle" |
| Background / Café | Subagents, workflows and background commands on one page: cards, a relationship graph and an activity feed, plus a pixel-art café where every subagent is a guest who checks out at the front desk when done; characters can be "made" from a photo or a single sentence; the Stop button in the input box only stops the current turn, background work keeps running |
| Web access | The agent searches, opens pages, clicks, fills forms and takes screenshots in the built-in browser, with no search key needed; on Windows it can also operate specific desktop apps once you allow it |
| Automation | Scheduled tasks (cron), goals (give it a goal and it keeps working turn after turn), and multi-agent orchestration, all on the sidebar's "Automation" page |
| Providers | Each conversation can use a different provider (official account / Anthropic-compatible relay / OpenAI / Gemini …), and the model menu lists them flat as "Provider / model"; keys are stored encrypted; each model's context window can be set individually; subagents can use a different (cheaper) model |
| Multiple agents | Besides Claude it can drive CLI agents such as Codex, Gemini, Qwen and Kimi, with the same interface |
| Remote | Pair by scanning a QR code and use it from your phone's browser, even away from your home Wi-Fi; SSH tunnels to remote machines; bots for Telegram / Discord / Slack / DingTalk / Feishu |
| Usage | Subscription quota ring, per-turn time and cost ledger, context usage |
| English / 中文 | The whole interface (web, the desktop app's menus and tray, the phone page, exported HTML) comes in English and Chinese; it follows your computer by default and you can change it in settings |
Desktop app or web version?
Use either one; the features are the same. The only difference is the shell:
| Desktop app | Web version | |
|---|---|---|
| How to open it | Installer, double-click | Run npm start, then open http://127.0.0.1:3090 in a browser |
| Needs Node.js | No (built in) | Yes, Node.js 22.13+ |
| Tray / system notifications / start at login | ✅ | Browser notifications |
| Multiple windows | ✅ | Multiple browser tabs |
| Shortcuts | Ctrl (⌘ on macOS) based | Some use Alt instead, to avoid combinations the browser takes |
| Phone access | Turn it on in settings, then open it in your phone's browser; the computer is kept awake while it's on | Same; turn off sleep yourself in your system's power settings |
Both read and write the same data (~/.claude and ~/.claude-web), so you can mix them.
Install
Desktop app (download an installer)
Download from Releases:
| System | File |
|---|---|
| Windows 10 / 11 (x64) | ClaudeWeb-<version>-win-x64.exe (installer) or ClaudeWeb-<version>-portable.exe (no install needed) |
| macOS, Apple Silicon (M1 and later) | ClaudeWeb-<version>-mac-arm64.dmg |
| macOS, Intel | ClaudeWeb-<version>-mac-x64.dmg |
The .zip, .yml and .blockmap files are used by auto-update; you don't need to download them. For what to expect the first time you open it, see "About the installer warnings" below. For what changed in each version, see the changelog.
Web version (from source)
You need Node.js 22.13+ (it uses the built-in node:sqlite) and Git:
git clone https://github.com/ypyik0669/claude-web.git
cd claude-web
npm install
npm run build
npm start
Then open http://127.0.0.1:3090 in your browser. On Windows you can also just double-click 启动.cmd in the repo (the Windows launcher script; its file name is in Chinese).
Desktop app (build it yourself)
npm install
npm run build:desktop # Windows: dist-desktop/ClaudeWeb-<version>-win-x64.exe (installer) and -portable.exe (no install needed)
npm run build:desktop:mac # macOS: can only be built on a Mac; build arm64 and x64 on a machine with the matching chip
npm run build:desktop:linux # Linux
About the installer warnings
- Windows: the installer is not code-signed. When SmartScreen says "Windows protected your PC", click More info → Run anyway.
- macOS: pick the package for your chip:
mac-arm64.dmgfor Apple Silicon (M1 and later),mac-x64.dmgfor Intel (Apple menu in the top left → About This Mac, and look at the "Chip" l
Frequently Asked Questions
What is claude-web?
claude-web is an open-source ai agents skill for AI coding assistants such as Claude Code, Codex CLI, and ChatGPT, built by ypyik0669. A GUI workbench for Claude Code and other CLI agents · Claude Code 的可视化工作台（网页 + 桌面），也能驱动 Codex / Gemini CLI / Qwen / OpenCode 等 CLI agent. It has 50 GitHub stars.
Is claude-web safe to use?
claude-web's catalog security scan is still queued. You can run an instant dependency and prompt-injection check now with the "Scan for vulnerabilities" button above.
How do I install claude-web?
Clone the repository with "git clone https://github.com/ypyik0669/claude-web" and add it to your Claude Code skills directory (see the Installation section above).
What programming language is claude-web written in?
claude-web is primarily written in TypeScript. It is open-source under ypyik0669 on GitHub, so you can review or fork the full source.
Are there alternatives to claude-web?
Yes. SkillsLLM lists many other AI Agents skills you can browse and compare side by side. Open the AI Agents category from the badge at the top of this page, or use the Related Skills and comparison links further down to weigh claude-web against similar tools.
Comments (0)
to leave a comment.
No comments yet. Be the first to share your thoughts!
Related Skills
Reverse engineer anything with agents, from app behavior down to native binaries.
374,645
93,697
TypeScript
AI Agentsagent-skillsai-agents
The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.
287,505
42,630
JavaScript
AI Agentsai-agentsanthropic
Skills for Real Engineers. Straight from my .agents directory.
250,518
21,171
Shell
AI Agents
An agentic skills framework & software development methodology that works.
234,966
20,863
Shell
AI Agentsaibrainstorming