🦞

── Hubify Labs ──

Claws

The frontend framework for building mission control dashboards on OpenClaw.

12 React hooks. WebSocket gateway client. 10 built-in themes. Visual Studio builder.

$npm install @claws/sdk

── The stack ──

Your dashboard. Your rules.

Claws sits between your UI and the OpenClaw runtime. Connect via WebSocket, stream chat responses, manage files, invoke tools, and build any dashboard experience.

@claws/sdkFramework-agnostic core. WebSocket, protocol, auth.

@claws/sdk/react12 React hooks for every workspace operation.

Claws StudioVisual builder. AI-assisted. Deploy in one click.

Theme Engine10 themes. Custom accents. Dark/light/everything.

architecture

Your Dashboard

React components + custom UI

@claws/sdk/react

12 hooks for chat, files, skills...

@claws/sdk

WebSocket client, protocol v3

OpenClaw Gateway

Agent runtime, file system, crons

── React Hooks ──

One hook for everything.

Every workspace operation has a dedicated hook. Type-safe. Real-time. Composable.

useChatSession

Send messages, stream responses, manage agent chat history

useWorkspaceFiles

Read, write, list, and watch files in real-time

useSkills

List installed skills, trigger executions, view logs

useCronJobs

Create, update, and monitor scheduled agent jobs

useNodes

Track workspace nodes, status, and metadata

usePresence

See connected devices and users in real-time

useToolsInvoke

Call any tool by name with typed arguments

useConfig

Read and write workspace configuration

useExecApprovals

Approve or reject pending tool executions

useChannels

Subscribe to live event channels

useGateway

Raw connection state, connect/disconnect

useSessions

List and manage gateway sessions

Full API reference →

── Theme engine ──

10 built-in themes. Infinite accents.

Dark

Midnight

Nord

Dracula

Synthwave

Catppuccin

Solarized

Terminal

Light

Paper

── Claws Studio ──

Describe it. Preview it. Deploy it.

Tell the AI what you want your dashboard to look like. Watch it build in real-time. Click through the interactive preview. Deploy to your live workspace in one click.

Vibe code

Describe your ideal dashboard in natural language. The AI generates the template.

Preview & interact

Click nav items, type in chat, run terminal commands. Test before deploying.

Deploy live

One click pushes your design to yourname.hubify.com. Import existing workspaces too.

Open Claws Studio

── Self-awareness ──

Agents that design their own UI.

Every Hubify workspace exposes a GET /self endpoint. Your agent knows its identity, capabilities, and how to customize its own dashboard.

Change colors. Rename itself. Add nav items. Create pages. All autonomously, all through the Claws API.

agent-self-edit.sh

# Agent sees itself

$ curl localhost:4000/self

identity, capabilities, API catalog

# Agent customizes its dashboard

$ curl -X POST /template-view

{"agentName":"Atlas","accent":"#60A5FA"}

# Agent adds a nav page

$ curl -X POST /template-view

{"navAppend":[{"id":"research","label":"Research"}]}

🦞

Build your mission control.

Claws is open. The SDK is free. Studio is live. Start building the dashboard your AI agent deserves.

Open Claws Studio Read the Docs