Try OpenClaw in your browser in less than 3 seconds.

Boot a full OpenClaw agent sandbox, chat with it, then click through to a real-time gateway dashboard — all from the browser. No install, no Docker, no CLI.

🔗 vibeclaw.dev · 𝕏 Community

vibeclaw is two things:

1. 📦 Sandbox mode — Boot an OpenClaw agent right in your browser. A real Node.js container (powered by almostnode) loads the OpenClaw runtime, and you chat via free models through OpenRouter. No API keys needed.

2. 🔴 Live Gateway mode — Connect to your running OpenClaw instance and get a full dashboard: sessions, agents, files, skills, cron jobs, metrics, presence, logs, and streaming chat.

1. Go to vibeclaw.dev
2. Pick a flavour from the dropdown
3. Click ▶ Start Now
4. Chat with the agent
5. Click 🔴 Connect → to open the gateway dashboard

1. Start your OpenClaw gateway locally
2. Open the Gateway Dashboard
3. Enter your gateway URL and token
4. See everything — all sessions, agents, workspace files, skills, cron jobs, cost tracking, and live logs

Flavours are swappable sandbox personalities. Each one defines its own agents, skills, teams, and system prompt. Pick one before booting — the entire sandbox (and gateway dashboard) adapts.

Add a directory under vfs-flavours/ with a manifest.json:

{
  "id": "my-flavour",
  "name": "My Flavour",
  "emoji": "🔥",
  "version": "1.0.0",
  "description": "What this flavour does",
  "agents": [
    { "id": "main", "name": "Lead", "emoji": "🔥", "description": "The main agent" },
    { "id": "helper", "name": "Helper", "emoji": "🤖", "description": "A helper agent" }
  ],
  "teams": [
    { "id": "core", "name": "Core Team", "leader": "main", "agents": ["main", "helper"] }
  ],
  "skills": [
    { "name": "my-skill", "emoji": "⚡", "description": "What it does" }
  ],
  "systemPrompt": "You are 🔥 My Flavour, a specialist in..."
}

Then rebuild:

npm run flavours:build

┌──────────────────────────────────────────────────┐
│                   vibeclaw.dev                    │
├──────────────────────┬───────────────────────────┤
│   📦 Sandbox Mode    │   🔴 Live Gateway Mode    │
│                      │                           │
│  almostnode container│  WebSocket to your         │
│  + OpenClaw VFS      │  OpenClaw gateway          │
│  + OpenRouter proxy  │  (JSON-RPC protocol v3)    │
│  + BroadcastChannel  │                           │
│    bridge to dash    │  Ed25519 auth via          │
│                      │  @noble/ed25519            │
├──────────────────────┴───────────────────────────┤
│              Gateway Dashboard                    │
│  Sessions · Agents · Files · Skills · Cron       │
│  Metrics · Presence · Logs · Streaming Chat      │
└──────────────────────────────────────────────────┘

When you boot a sandbox and click 🔴 Connect →, the gateway dashboard opens in a new tab. Communication happens via BroadcastChannel (same-origin, cross-tab) — no server needed. The sandbox mimics a full OpenClaw gateway, responding to all dashboard API calls.

• almostnode — Browser-native Node.js runtime with virtual filesystem
• OpenClaw — AI agent framework with gateway protocol
• @noble/ed25519 — Pure JS Ed25519 for gateway auth (works on HTTP origins)
• OpenRouter — Free model access (server-proxied, no API key needed)

• Node.js 20+

git clone https://github.com/jasonkneen/vibeclaw.git
cd vibeclaw
npm install

npm run dev

Opens on http://localhost:5173 with hot reload.

npm run flavours:build   # Build flavour index
npm run build            # Production build

├── index.html                    # Homepage + sandbox
├── examples/
│   ├── openclaw-gateway-demo.html  # Full gateway dashboard
│   ├── openclaw-connect-demo.html  # Minimal connect demo
│   ├── openclaw-client.js          # Reusable WS client
│   └── shared-styles.css           # Shared demo styles
├── vfs-flavours/                 # Flavour definitions
│   ├── default/manifest.json       # 🦀 OpenClaw
│   ├── tinyclaw/                   # 🦞 TinyClaw (full workspace)
│   ├── devops/manifest.json        # 🚀 ShipIt
│   ├── hacker/manifest.json        # 💀 R00t
│   ├── pixie/manifest.json         # ✨ Pixie
│   └── professor/manifest.json     # 🎓 Professor
├── vfs-extra/                    # Extra VFS files merged into snapshot
│   └── data/workspace/            # Agent workspace (SOUL.md, skills, docs)
├── netlify/functions/
│   └── chat.mjs                   # Serverless OpenRouter proxy
├── scripts/
│   ├── build-flavours.mjs         # Flavour index builder
│   └── build-vfs-extra.mjs        # VFS merger
├── public/
│   └── flavours.json              # Built flavour index
├── docs/                          # Documentation pages
├── src/                           # almostnode runtime source
└── dist/openclaw/                 # Built OpenClaw VFS snapshot

vibeclaw.dev runs on Netlify:

• Static site build via Vite
• Serverless function at /api/chat proxies to OpenRouter (API key stays server-side)
• Custom domain: vibeclaw.dev
• COOP/COEP headers for SharedArrayBuffer support

The gateway dashboard communicates via WebSocket JSON-RPC:

// Request
{ type: "req", id: 1, method: "status", params: {} }

// Response
{ type: "res", id: 1, ok: true, payload: { ... } }

// Event (server push)
{ type: "event", event: "chat", payload: { state: "delta", message: { content: "..." } } }

1. WebSocket open → server sends connect.challenge event with nonce
2. Client signs nonce with Ed25519 → sends connect request
3. Server responds with hello + session info

• WebGPU local LLM — Qwen2.5-Coder 1.5B via WebLLM (~900MB, fully offline)
• More free models — as they appear on OpenRouter
• Flavour workspace loading — full VFS snapshots per flavour (not just manifest)
• Community flavours — submit your own via PR
• Live gateway relay — connect to remote gateways from any network

• almostnode — The browser-native Node.js runtime that makes this possible
• OpenClaw — The AI agent framework
• TinyClaw — Multi-agent orchestrator (inspiration for the TinyClaw flavour)
• OpenRouter — Free model API access

MIT — see LICENSE for details.

vibeclaw.dev · Built by @jasonkneen