Canvas Skill

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

2|1|Updated Feb 13, 2026
One-click install
npx skills add https://github.com/simplefarmer69/ape-claw --skill canvas-skill-simplefarmer69
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: Canvas Skill
Source: https://github.com/simplefarmer69/ape-claw/tree/main/data/forge-skills/canvas
Command: npx skills add https://github.com/simplefarmer69/ape-claw --skill canvas-skill-simplefarmer69

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill allows you to display rich HTML content, visualizations, and interactive demos directly on the screens of connected OpenClaw nodes, bridging the gap between web content and your agent's interface.

Core Features & Use Cases

  • Cross-Platform Display: Renders HTML content on Mac, iOS, and Android OpenClaw apps.
  • Dynamic Content: Supports live reloading for rapid development and real-time updates.
  • Interactive Elements: Enables actions like navigation, JavaScript execution, and screen snapshots.
  • Use Case: Display a live stock market dashboard, a game, or a generated visualization directly on your agent's connected device.

Quick Start

Use the canvas skill to present the HTML file '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 HTML content on connected client devices?

To display HTML content on connected client devices, you can use a local HTTP server bridging mechanism to render arbitrary web content directly on Mac, iOS, and Android OpenClaw apps.

Can I run interactive web visualizations on iOS and Android nodes?

Yes, you can run interactive web visualizations on iOS and Android nodes. The Skill supports cross-platform rendering of dynamic content, web-based games, and interactive dashboards across these mobile devices.

How do I execute JavaScript and capture screenshots of displayed canvas content?

You can execute JavaScript and capture screenshots of displayed canvas content by triggering specific supported actions, allowing you to evaluate scripts and take snapshots of the rendered web interface.

Does this canvas display method support live reloading for rapid development?

Yes, the canvas display method supports live reloading for rapid development. This feature allows you to push real-time updates and dynamically refresh the HTML content shown on the connected node.

What is needed to present an HTML file on a specific node app?

To present an HTML file on a specific node app, you need to provide the local HTML file path and the target node ID, enabling the bridging mechanism to route and display the content.