Claude Code Web
Description
A web-based interface for Claude Code CLI built with Nuxt 4, featuring real-time chat, project management, and comprehensive tool integration with mobile-first PWA design.
Installation
This entry records only its repository, not the path inside it, so there is no
exact command to give. Open the source below and copy the folder into
~/.claude/skills/, or the file into ~/.claude/agents/.
README
Claude Code Web
A browser-based WebUI interface for [Claude Code CLI](https://github.com/anthropic/claude-code) with extras like voice input, text-to-speech, drag-and-drop images, hotkeys, and a built-in todo sidebar.
Quick Start
**Install** (requires Node.js 18+ and Claude Code CLI set up)
npm install -g @sunpix/claude-code-web**Run**
claude-code-webOpen [http://localhost:3000](http://localhost:3000) in your browser.
⚠️ No authentication mechanism. Anyone with access to the port can control your environment/computer. Run behind a firewall or proxy with auth.
📹 Demo Videos
https://github.com/user-attachments/assets/e787a7e3-4300-486d-bd20-4080c5ee255f
https://github.com/user-attachments/assets/418a2aba-829c-40f5-9b04-8e92eae4e8e3
(older version)
Configuration
Change Port
PORT=8080 claude-code-webServe from Subpath (reverse proxy)
APP_BASE_URL=/claude-code claude-code-webEnable Whisper Mic Support
Requires OpenAI API key for speech-to-text:
OPENAI_API_KEY=sk_... claude-code-webScreenshot
Related Skills
Algorithmic Art
Create generative art using p5.js with seeded randomness, flow fields, and particle systems
Brand Guidelines
Apply Anthropic's official brand colors and typography to artifacts
Canvas Design
Create beautiful visual art in PNG and PDF documents using design philosophy
Frontend Design
Create distinctive, production-grade frontend interfaces with high design quality
Slack Gif Creator
Create animated GIFs optimized for Slack's size constraints
Theme Factory
Style artifacts with professional themes including 10 pre-set color/font combinations