skills.rest
sky770825
sky770825COMMUNITY
Explore all skills by this author →
GitHub

Canvas Skill

Display HTML content on connected OpenClaw nodes via a local HTTP server.

Updated Feb 3, 2026
Search Tags:#cross-platform#canvas#web content#live reload#node display#html rendering
One-click install
npx skills add https://github.com/sky770825/openclaw-console-hub --skill canvas-skill-sky770825
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: Canvas Skill
Source: https://github.com/sky770825/openclaw-console-hub/tree/main/openclaw-main/skills/canvas
Command: npx skills add https://github.com/sky770825/openclaw-console-hub --skill canvas-skill-sky770825

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 games, visualizations, or interactive demos, directly on the screens of connected OpenClaw nodes (Mac, iOS, Android).

Core Features & Use Cases

  • Cross-Platform Display: Renders HTML content on various device types.
  • Live Reload: Facilitates rapid development by automatically updating content on changes.
  • Use Case: Developers can instantly preview interactive UI mockups or dashboards on target devices during the development process.

Quick Start

Use the canvas skill to present the 'my-game.html' file on the 'mac-63599bc4-b54d-4392-9048-b97abd58343a' node.

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 connected devices for cross-platform preview?▼

To display HTML content on connected devices, you present local files to connected OpenClaw nodes using a local HTTP server and a communication bridge, rendering the web content directly on Mac, iOS, or Android screens.

Can I evaluate JavaScript and capture snapshots of the canvas view remotely?▼

Yes, you can evaluate JavaScript and capture snapshots of the canvas view remotely. The Skill supports actions like presenting, navigating, executing scripts, and taking captures of the HTML content displayed on connected nodes.

Does the canvas display method work with Tailscale for network accessibility?▼

Tailscale integration enables network accessibility across devices for the canvas display. This allows you to present HTML content and interactive visualizations on connected OpenClaw nodes over a secure network connection.

How do I set up live reload for interactive web content during development?▼

Live reload facilitates rapid development by automatically updating web content on changes. You use the Skill to present HTML files on target nodes, and it refreshes the displayed interactive UI mockups or dashboards instantly.

What is the best way to present an HTML game on a specific OpenClaw node?▼

The best way to present an HTML game on a specific OpenClaw node is by using the Skill to target the node identifier. It renders the HTML file locally and bridges the content to the specified device screen.

Are there limitations when rendering interactive web content on iOS or Android nodes?▼

Rendering interactive web content on iOS or Android nodes depends on the OpenClaw node connectivity and the local HTTP server bridge. Limitations may arise from network accessibility constraints or device-specific HTML rendering behaviors.

Related Skills

Explore More Software Engineering Skills→
storyclaw-officialstoryclaw-official

Canvas Skill

Present and interact with HTML content on OpenClaw nodes via a local HTTP server.

Official
Intermediate
elizaOSelizaOS
19.0k

canvas

Display HTML content on connected Otto nodes across Mac, iOS, and Android.

Official
Intermediate
malue-aimalue-ai
36

canvas

Display HTML content on connected Moltbot nodes across Mac, iOS, and Android.

Official
Intermediate
coltonbattscoltonbatts

Canvas Skill

Display HTML content on remote nodes via a local HTTP server and bridge.

Community
Intermediate