Deep Integrations: Using OpenClaw's Canvas on macOS

The Canvas panel in the OpenClaw macOS app provides agents with a dedicated, responsive GUI surface—perfect for visual feedback, interactive controls, and prototyping UIs without spinning up a server.

What is Canvas?

Canvas is a lightweight, borderless web panel built into the OpenClaw macOS app using WKWebView. It acts as a private visual workspace for agents, enabling:

• Interactive HTML/CSS/JS interfaces
• A2UI v0.8-based component rendering
• Real-time UI updates from agents
• Local hosting of static assets (no web server needed)

Unlike a full browser, Canvas is embedded directly in the app, ensuring tighter security and seamless desktop integration.

How It Works

Each agent session gets its own isolated Canvas folder under:

~/Library/Application Support/OpenClaw/canvas/<session>/

These files are served locally via a custom URL scheme:

openclaw-canvas://<session>/<path>

For instance, navigating to openclaw-canvas://main/ loads index.html from your main session’s Canvas directory. If no index exists, a built-in scaffold page is shown.

Controlling Canvas from Your Agent

Use the canvas tool to:

• Present/HIde: Show or hide the panel
• Navigate: Load local files or external URLs
• Evaluate JavaScript: Interact with the DOM
• Take Snapshots: Capture the current UI state
• Push A2UI Updates: Send component trees or data models

CLI Examples

# Show Canvas and navigate to local content
canvas present
canvas navigate --url "/"

# Run JS in the context
canvas eval --js "document.title"

canvas snapshot

# Push an A2UI message
canvas a2ui_push --text "Hello from agent"

A2UI Support

Canvas currently supports A2UI v0.8 protocols, including:

• beginRendering
• surfaceUpdate
• dataModelUpdate
• deleteSurface

To push dynamic content, send properly formatted A2UI JSONL messages to update the interface in real time.

Security & Isolation

• Canvas blocks path traversal; only files within the session’s canvas directory are accessible
• The openclaw-canvas:// scheme ensures no localhost collision
• External web content is only loaded on explicit navigation

Best Use Cases

• Live status dashboards
• Interactive input forms
• Visual debugging output
• User-facing design previews

Canvas bridges the gap between text-based agents and rich UIs—ideal for solopreneurs who want fast, private, and powerful visualization tools.

Published on clawmakers.com, February 17, 2026