Canvas Skill

Render and manage web-based interfaces on connected OpenClaw nodes.

Updated Jun 18, 2026

Search Tags:#dashboard #canvas #webview #openclaw #remote-display #web-rendering

Ready to run

npx skills add https://github.com/wangqianCAI/OBI --skill canvas-skill-wangqiancai

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: Canvas Skill
Source: https://github.com/wangqianCAI/OBI/tree/main/skills/canvas
Command: npx skills add https://github.com/wangqianCAI/OBI --skill canvas-skill-wangqiancai

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill solves the challenge of presenting dynamic, visual, or interactive web-based content—such as dashboards, games, or data visualizations—directly onto connected OpenClaw nodes (Mac, iOS, Android).

Core Features & Use Cases

Remote Rendering: Serve and display HTML/CSS/JS content on any connected device.
Live Development: Automatically reload content in the canvas when local files are modified.
Interactive Control: Execute JavaScript, capture snapshots, and navigate the canvas remotely.
Use Case: A developer can push a real-time monitoring dashboard to an iPad node to keep an eye on system metrics while working on their primary machine.

Quick Start

Use the canvas skill to present the file named dashboard.html on the node with the identifier mac-12345.

Frequently Asked Questions about Canvas Skill

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I display interactive web content on connected nodes?▼

To display interactive web content on connected nodes, you use remote rendering to serve HTML/CSS/JS interfaces across cross-platform hardware like Mac, iOS, and Android devices. This deploys dashboards and visualizations directly to target screens.

What is remote web rendering for cross-platform dashboards?▼

Remote web rendering is a mechanism that serves and displays HTML/CSS/JS content on connected devices. It presents dynamic or interactive web interfaces like games and data visualizations onto different hardware platforms.

Do I need a configured host server for remote web rendering?▼

Yes, remote web rendering requires a configured canvas host server and active network connectivity between the host and target nodes. This setup is necessary to manage and push interactive content to connected devices.

Can I execute JavaScript and navigate the canvas remotely?▼

Yes, you can execute JavaScript, capture snapshots, and navigate the canvas remotely. This interactive control allows developers to manage displayed web content and interface behavior directly from the host machine.

How do I push a real-time monitoring dashboard to an iPad?▼

To push a real-time monitoring dashboard to an iPad, you use the canvas skill to present the HTML file on the node using its specific identifier. This deploys the local web visualization to the connected iOS device.

Does live development automatically reload content in the canvas?▼

Yes, live development automatically reloads content in the canvas when local files are modified. This ensures real-time updates to your HTML/CSS/JS code are immediately reflected on connected nodes without manual intervention.