Canvas Skill

Serve and manage HTML content on connected OpenClaw nodes via a local HTTP server.

19|3|Updated Mar 7, 2026
One-click install
npx skills add https://github.com/samttoo22-MewCat/OpenSoul --skill canvas-skill-samttoo22-mewcat
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: Canvas Skill
Source: https://github.com/samttoo22-MewCat/OpenSoul/tree/main/openclaw/skills/canvas
Command: npx skills add https://github.com/samttoo22-MewCat/OpenSoul --skill canvas-skill-samttoo22-mewcat

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill enables the display of rich web content, such as visualizations, dashboards, and interactive demos, on connected OpenClaw nodes (Mac, iOS, Android), bridging the gap between AI and user interfaces.

Core Features & Use Cases

  • Cross-Platform Display: Renders HTML/CSS/JS content on various device types.
  • Dynamic Content: Supports live reloading for development and real-time updates.
  • Interactive Elements: Allows for JavaScript execution within the canvas.
  • Use Case: Visualize real-time data from an AI analysis directly on a tablet interface or present an interactive game developed by the AI on a user's desktop.

Quick Start

Use the canvas skill to present the HTML content located at ~/clawd/canvas/my-game.html on the node with ID mac-63599bc4-b54d-4392-9048-b97abd58343a.

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 HTML content on connected devices from an AI?

You can display interactive HTML content on connected devices by using a local HTTP server and bridge communication to render web visualizations and dashboards directly on connected nodes.

Can I run JavaScript and capture screenshots within a web canvas?

Yes, you can execute JavaScript and capture screenshots within the web canvas. The Skill supports JavaScript evaluation for interactive UI elements and provides screenshot capture functionality for visualization.

Does the canvas display tool work across Mac, iOS, and Android nodes?

Yes, the canvas display tool works across Mac, iOS, and Android nodes. It presents and manages HTML content on connected OpenClaw nodes, using Tailscale integration to ensure network accessibility across these platforms.

What is the best way to present real-time data visualizations on a tablet interface?

The best way to present real-time data visualizations on a tablet interface is using this Skill's live reload feature, which streams dynamic HTML content updates directly to connected iOS or Android nodes for interactive UI display.

How do I show an interactive web demo on a specific node ID?

To show an interactive web demo on a specific node, you reference the local HTML file path and target the node ID. The Skill bridges the local HTTP server to the specified connected node to display the content.