{"id":50388926,"url":"https://github.com/ketthub/clawUI","last_synced_at":"2026-06-16T08:00:50.359Z","repository":{"id":337294212,"uuid":"1153003833","full_name":"ketthub/clawUI","owner":"ketthub","description":"A sleek, open-source desktop client for OpenClaw. Built with React, Vite,  and Electron for a fast, responsive, and experimental \"Vibe Coding\"  experience.","archived":false,"fork":false,"pushed_at":"2026-04-04T10:39:52.000Z","size":2392,"stargazers_count":17,"open_issues_count":1,"forks_count":6,"subscribers_count":1,"default_branch":"main","last_synced_at":"2026-06-04T23:22:14.676Z","etag":null,"topics":["ai-agent","ai-ui","chat-interface","clawbot","electron","openclaw","react","tailwind-css","typescript","vibe-coding","vite"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ketthub.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-02-08T18:54:42.000Z","updated_at":"2026-05-18T23:21:20.000Z","dependencies_parsed_at":"2026-03-02T22:02:18.419Z","dependency_job_id":null,"html_url":"https://github.com/ketthub/clawUI","commit_stats":null,"previous_names":["kt-l/clawui","ketthub/clawui"],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/ketthub/clawUI","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ketthub%2FclawUI","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ketthub%2FclawUI/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ketthub%2FclawUI/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ketthub%2FclawUI/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ketthub","download_url":"https://codeload.github.com/ketthub/clawUI/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ketthub%2FclawUI/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34396429,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-16T02:00:06.860Z","response_time":126,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ai-agent","ai-ui","chat-interface","clawbot","electron","openclaw","react","tailwind-css","typescript","vibe-coding","vite"],"created_at":"2026-05-30T17:00:24.151Z","updated_at":"2026-06-16T08:00:50.350Z","avatar_url":"https://github.com/ketthub.png","language":"TypeScript","funding_links":[],"categories":["Clients \u0026 GUIs"],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003ch1 align=\"center\"\u003eClawUI\u003c/h1\u003e\n  \u003cp align=\"center\"\u003eA modern, ChatGPT-style web \u0026 desktop client for \u003ca href=\"https://github.com/openclaw/openclaw\"\u003eOpenClaw Gateway\u003c/a\u003e.\u003c/p\u003e\n\u003c/p\u003e\n\n\u003e **This project is no longer maintained.**\n\u003e\n\u003e On April 4, 2026, Anthropic officially prohibited the use of their subscription quota through OpenClaw. As a result, this project has been archived and will no longer receive updates.\n\u003e\n\u003e The code remains available for reference purposes.\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"#quick-start\"\u003eQuick Start\u003c/a\u003e •\n  \u003ca href=\"#features\"\u003eFeatures\u003c/a\u003e •\n  \u003ca href=\"#file-manager\"\u003eFile Manager\u003c/a\u003e •\n  \u003ca href=\"#demo\"\u003eDemo\u003c/a\u003e •\n  \u003ca href=\"#desktop-app\"\u003eDesktop App\u003c/a\u003e •\n  \u003ca href=\"#configuration\"\u003eConfiguration\u003c/a\u003e •\n  \u003ca href=\"LICENSE\"\u003eLicense\u003c/a\u003e\n\u003c/p\u003e\n\n![ClawUI Preview](./UIpreview.png)\n\n## Why ClawUI?\n\nOpenClaw's built-in webchat is functional but minimal. ClawUI gives you a full-featured chat interface — session management, rich rendering, tool call inspection, keyboard shortcuts, file management, and deep UI customization — all connecting directly to your Gateway via WebSocket. No extra backend needed.\n\n## Quick Start\n\n\u003e **Prerequisites:** Node.js ≥ 22, npm ≥ 10, a running [OpenClaw Gateway](https://docs.openclaw.ai/gateway)\n\n```bash\ngit clone https://github.com/Kt-L/clawUI.git\ncd clawUI\nnpm install\nnpm run dev\n```\n\nOpen the URL printed by Vite (default `http://localhost:5178`), go to **Settings**, and enter your Gateway URL + token/password. That's it.\n\n## Features\n\n**Chat**\n- Streaming AI responses with live thinking animation\n- Markdown, syntax-highlighted code blocks, LaTeX math (KaTeX), and tables\n- Tool call timeline — collapsed by default, expandable for full args \u0026 output; running tools show a pulsing status dot\n- File \u0026 image attachments with visual preview cards, auto-compression, and size estimation\n- Smart text file embedding — text-based attachments (source code, config, markdown, etc.) are decoded and sent inline as `\u003cfile\u003e` tags for better model context; binary files are labeled accordingly\n- OpenClaw envelope stripping — user messages are automatically cleaned of gateway-injected metadata (system events, conversation info / sender metadata, timestamps) for a cleaner chat display\n- Reply-done sound notifications (built-in tones or custom audio)\n- Graceful WebSocket error handling — invalid gateway URLs no longer crash the connection loop\n\n**Sessions**\n- Create, search, switch, and delete sessions from the sidebar\n- Session titles and previews are sanitized (envelope metadata stripped) for cleaner display\n- History pagination with incremental loading\n- Multi-agent support — create sessions bound to specific agents\n- Delete spinner animation with visual feedback\n\n**File Manager**\n- Built-in file browser accessible from the sidebar — switch between chat and files with a 3D flip animation\n- Browse, preview, edit, upload, download, create folders, and delete files\n- Configurable root directories via `~/.openclaw/clawui-fs.json`\n- Preview support for Markdown (rendered), text/code files, images, and PDFs\n- In-browser text file editing with Cmd/Ctrl+S save and unsaved-change indicator\n- Drag-and-drop file upload with visual drop overlay\n- Sort by name, size, or date; toggle hidden files\n- Breadcrumb navigation with root tabs\n- Security: all paths are validated and scoped to configured roots (symlink-aware)\n- Works in both web (Vite dev server plugin) and desktop (custom `claw-fs://` protocol)\n- Remote file server support — configure a File Server URL in Settings for cross-device access\n\n**Frost \u0026 Glow Visual Theme**\n- Glassmorphism-inspired design with warm-yellow accent palette and refined design tokens\n- 3D perspective tilt on session and file cards — hover to see the entire card (border, background, shadow) respond to cursor position with specular glow highlights\n- Directional coin-flip animation on session card click — the card flips from the side you clicked\n- 3D sidebar flip transition between chat and file views\n- Staggered \"drawer pop\" fly-in animations when switching sessions\n- Composer launch impulse and chat thread physics on send\n- Smooth sidebar slide-in/collapse, menu entrance, and modal backdrop transitions\n- Custom text selection styling with accent-tinted highlight\n- Connection status dots with subtle glow rings\n- Copy button press animation with success state\n\n**Slash Commands**\n- `/status` `/models` `/model` `/think` `/compact` `/abort` `/new` `/reset` and more\n- Autocomplete popup with keyboard navigation (↑↓ + Enter/Tab)\n\n**Shortcuts**\n- Configurable app action shortcuts — Toggle Sidebar and New Session with full modifier customization (Cmd/Ctrl/Alt/Shift + key), enable/disable per action\n- Up to 5 custom model shortcuts (model + thinking level combo)\n- Up to 5 custom agent-session shortcuts\n\n**UI Customization**\n- Font family, size, line height, content width\n- Color schemes and themes\n- Animation toggle — enable or disable all motion effects (including sidebar flip and card tilt)\n- Settings schemes — save \u0026 switch between presets\n- All changes apply instantly, persisted in localStorage\n\n![Tool Calls \u0026 Sidebar](./UIpreview2.png)\n\n## File Manager\n\nThe file manager provides a full file browser alongside the chat interface. Click the **Files** button in the sidebar to switch views.\n\n**Setup:** By default, ClawUI serves files from `~/.openclaw/workspace`. To customize accessible directories, create `~/.openclaw/clawui-fs.json`:\n\n```json\n{\n  \"roots\": [\n    { \"label\": \"Workspace\", \"path\": \"/Users/you/.openclaw/workspace\" },\n    { \"label\": \"Projects\", \"path\": \"/Users/you/projects\" }\n  ]\n}\n```\n\n**Desktop:** The file manager works natively via the `claw-fs://` protocol — no extra server needed.\n\n**Remote access:** To browse files from a remote machine running the Vite dev server, set the **File Server URL** in Settings (e.g. `http://192.168.1.100:5178`).\n\n## Demo\n\nhttps://github.com/user-attachments/assets/ef7d17be-8a14-40d3-896e-f26839052041\n\n\u003e *Short walkthrough of the UI*\n\n## Desktop App\n\nClawUI supports Electron packaging for a native desktop experience with local image resolution and file system access.\n\n```bash\nnpm run build\nnpm run desktop:pack          # unpacked app for current OS\nnpm run desktop:dist:mac      # unsigned macOS .dmg + .zip\n```\n\nSee [DESKTOP.md](DESKTOP.md) for details on macOS Gatekeeper and first-launch instructions.\n\n### Download from Releases\n\nPre-built **unsigned** macOS desktop build is available on the [Releases](https://github.com/Kt-L/clawUI/releases) page.\n\n\u003e ⚠️ **This build is unsigned.** macOS Gatekeeper will block the app on first launch. To open it:\n\u003e 1. Right-click the app and choose **Open**.\n\u003e 2. Confirm the security prompt once.\n\u003e\n\u003e After the first launch, the app will open normally.\n\n## Configuration\n\n| Variable | Default | Description |\n|----------|---------|-------------|\n| `PORT` | `5178` | Vite dev server port |\n| `CLAWUI_IMAGE_PROXY_PORT` | `3000` | Local image proxy port (desktop) |\n| `OPENCLAW_WORKSPACE_DIR` | auto | Override workspace path for desktop runtime |\n\nGateway connection settings (URL, token, password) and File Server URL are configured in the UI under **Settings**.\n\n## Project Structure\n\n```\nsrc/               React app, components, and client logic\nsrc/components/    Chat view, session sidebar, file manager, settings modal\nsrc/lib/           Gateway client, markdown renderer, UI settings, utilities\nsrc/hooks/         Custom React hooks (e.g. useCardTilt for 3D tilt effect)\nelectron/          Desktop main/preload bridge, local image \u0026 file system protocols\nscripts/           Runtime and environment checks\nvite-fs-plugin.ts  Vite dev server plugin for file system REST API\n```\n\n## Disclaimer \u0026 Status\n\n⚠️ This project is an AI-assisted rapid development experiment.\n\nBecause it was built quickly with the help of AI, the codebase may contain bugs, edge cases, or unoptimized architecture. It is published strictly for learning, inspiration, and reference purposes.\n\n## License\n\n[MIT](LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fketthub%2FclawUI","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fketthub%2FclawUI","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fketthub%2FclawUI/lists"}