Canvas Skill

Hosts and serves static web files to OpenClaw node canvases via WebView with live reload.

Updated Feb 8, 2026
One-click install
npx skills add https://github.com/dioerden/OpenClaw-Flash-Vault --skill canvas-skill-dioerden
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: Canvas Skill
Source: https://github.com/dioerden/OpenClaw-Flash-Vault/tree/main/skills/canvas
Command: npx skills add https://github.com/dioerden/OpenClaw-Flash-Vault --skill canvas-skill-dioerden

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides a solution for presenting HTML content on connected OpenClaw nodes, enabling the display of games, visualizations, dashboards, and interactive demos.

Core Features & Use Cases

  • Canvas Hosting: Serve static HTML/CSS/JS files from the canvasHost.root directory.
  • Content Rendering: Render web content on Mac, iOS, Android node canvases using a WebView.
  • Live Reload: Automatically reloads canvases when files in the root directory change for efficient development.
  • Configuration: Allow configuration for live reload, canvas host port, and gateway binding.
  • Use Cases: Displaying games, visualizations, dashboards, interactive demos.

Quick Start

Run the canvas skill and use the following command to present HTML content on a specific node: canvas action:present node:<node-id> target:<full-url>

Frequently Asked Questions about Canvas Skill

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

FAQPage Schema
How do I display HTML content on OpenClaw connected nodes?

To display HTML content on OpenClaw nodes, run the canvas skill and execute `canvas action:present node:<node-id> target:<full-url>` to render web content on the target node's canvas.

Can I host static web files for rendering on iOS, Android, and Mac canvases?

Yes, you can serve static HTML, CSS, and JS files from the `canvasHost.root` directory to render web content on Mac, iOS, and Android node canvases using a WebView component.

Does the canvas skill support live reload for static web file development?

Yes, the canvas skill supports live reload, automatically reloading connected canvases when files in the `canvasHost.root` directory change to streamline your web content development workflow.

How do I configure host settings and gateway bindings for network access?

You can configure canvas host settings, including the canvas host port and gateway binding, to enable network access and serve static web files to connected OpenClaw nodes.

What can I present on OpenClaw node canvases using HTML content?

You can present games, visualizations, dashboards, and interactive demos by hosting and serving static HTML, CSS, and JS files on connected OpenClaw node canvases.

What is the best way to show interactive web demos on multiple OpenClaw nodes?

The best way to show interactive web demos on OpenClaw nodes is to host the static web files in the root directory and use the present command to render them on target node canvases with live reload support.