Control UI

• default: http://<host>:18789/
• optional prefix: set gateway.controlUi.basePath (e.g. /openclaw)

​

Quick open (local)

• connect.params.auth.token
• connect.params.auth.password
• Tailscale Serve identity headers when gateway.auth.allowTailscale: true
• trusted-proxy identity headers when gateway.auth.mode: "trusted-proxy"

​

Device pairing (first connection)

openclaw devices list

openclaw devices approve <requestId>

​

Pair a mobile device

​

Personal identity (browser-local)

​

Runtime config endpoint

​

Gateway host status

​

Language support

• Supported locales: en, ar, de, es, fa, fr, hi, id, it, ja-JP, ko, nl, pl, pt-BR, ru, th, tr, uk, vi, zh-CN, zh-TW
• Non-English translations are lazy-loaded in the browser.
• The selected locale is saved in browser storage and reused on future visits.
• Missing translation keys fall back to English.

​

Appearance themes

​

Sidebar navigation

​

What it can do (today)

​

MCP page

1. Open MCP from the sidebar.
2. Check the summary cards for total, enabled, OAuth, and filtered server counts.
3. Review each server row for transport, enablement, auth, filters, timeouts, and command hints.
4. Toggle enablement when a server should remain configured but stay out of runtime discovery.
5. Edit the scoped mcp config section for server definitions, headers, TLS/mTLS paths, OAuth metadata, tool filters, and Codex projection metadata.
6. Use Save for a config write, or Save & Publish when the running Gateway should apply the changed config.
7. Run openclaw mcp status --verbose, openclaw mcp doctor --probe, or openclaw mcp reload from a terminal for static diagnostics, live proof, or cached-runtime disposal.

​

Activity tab

​

Operator terminal

​

Chat behavior

​

Connection loss and reconnect

​

PWA install and web push

• OPENCLAW_VAPID_PUBLIC_KEY
• OPENCLAW_VAPID_PRIVATE_KEY
• OPENCLAW_VAPID_SUBJECT (defaults to https://openclaw.ai)

• push.web.vapidPublicKey fetches the active VAPID public key.
• push.web.subscribe registers an endpoint plus keys.p256dh/keys.auth.
• push.web.unsubscribe removes a registered endpoint.
• push.web.test sends a test notification to the caller’s subscription.

​

Hosted embeds

{
  gateway: {
    controlUi: {
      embedSandbox: "scripts",
    },
  },
}

​

Chat message width

{
  gateway: {
    controlUi: {
      chatMessageMaxWidth: "min(1280px, 82%)",
    },
  },
}

​

Tailnet access (recommended)

openclaw gateway --tailscale serve

openclaw gateway --bind tailnet --token "$(openssl rand -hex 32)"

​

Insecure HTTP

• localhost-only insecure HTTP compatibility with gateway.controlUi.allowInsecureAuth=true
• successful operator Control UI auth through gateway.auth.mode: "trusted-proxy"
• break-glass gateway.controlUi.dangerouslyDisableDeviceAuth=true

{
  gateway: {
    controlUi: { allowInsecureAuth: true },
    bind: "tailnet",
    auth: { mode: "token", token: "replace-me" },
  },
}

{
  gateway: {
    controlUi: { dangerouslyDisableDeviceAuth: true },
    bind: "tailnet",
    auth: { mode: "token", token: "replace-me" },
  },
}

​

Content security policy

• Avatars and images served under relative paths (for example /avatars/<id>) still render, including authenticated avatar routes the UI fetches and converts into local blob: URLs.
• Inline data:image/... URLs still render.
• Local blob: URLs created by the Control UI still render.
• GitHub link preview avatars are fetched by the Gateway from GitHub’s fixed avatar host and returned as bounded data: URLs; the operator browser never contacts the remote avatar host.
• Remote avatar URLs emitted by channel metadata are stripped at the Control UI’s avatar helpers and replaced with the built-in logo/badge, so a compromised or malicious channel cannot force arbitrary remote image fetches from an operator browser.

​

Avatar route auth

• GET /avatar/<agentId> returns the avatar image only to authenticated callers. GET /avatar/<agentId>?meta=1 returns the avatar metadata under the same rule.
• Unauthenticated requests to either route are rejected (matching the sibling assistant-media route), so the avatar route cannot leak agent identity on hosts that are otherwise protected.
• The Control UI forwards the gateway token as a bearer header when fetching avatars, and uses authenticated blob URLs so the image still renders in dashboards.

​

Assistant media route auth

• GET /__openclaw__/assistant-media?meta=1&source=<path> requires the normal Control UI operator auth; the browser sends the gateway token as a bearer header when checking availability.
• Successful metadata responses include a short-lived mediaTicket scoped to that exact source path.
• Browser-rendered image, audio, video, and document URLs use mediaTicket=<ticket> instead of the active gateway token or password. The ticket expires quickly and cannot authorize a different source.

​

Building the UI

pnpm ui:build

OPENCLAW_CONTROL_UI_BASE_PATH=/openclaw/ pnpm ui:build

pnpm ui:dev

​

Blank Control UI page

• Disable extensions that inject into all pages, especially extensions with <all_urls> content scripts.
• Try a private window, a clean browser profile, or another browser.
• Keep the Gateway running and verify the same dashboard URL after the browser change.

​

Debugging/testing: dev server + remote Gateway

pnpm ui:dev

http://localhost:5173/?gatewayUrl=ws%3A%2F%2F<gateway-host>%3A18789

http://localhost:5173/?gatewayUrl=wss%3A%2F%2F<gateway-host>%3A18789#token=<gateway-token>

{
  gateway: {
    controlUi: {
      allowedOrigins: ["http://localhost:5173"],
    },
  },
}

​

Related

• Dashboard — gateway dashboard
• Health Checks — gateway health monitoring
• TUI — terminal user interface
• WebChat — browser-based chat interface