Canvas Skill

Renders HTML content on Mac, iOS, and Android nodes via host server and node bridge architecture.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill allows you to visually present dynamic web content, such as dashboards, games, or interactive demos, directly on connected devices like Mac, iOS, and Android, bridging the gap between web technologies and native applications.

Core Features & Use Cases

  • Cross-Platform Display: Renders HTML content in a WebView on Mac, iOS, and Android nodes.
  • Real-time Updates: Supports live reloading for rapid development and immediate feedback.
  • Flexible Binding: Integrates with Tailscale for seamless network connectivity across devices.
  • Use Case: Displaying a real-time stock market dashboard on your tablet or running a web-based game on your Mac.

Quick Start

Present the HTML file 'my-game.html' on your Mac 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 web content on iOS and Android nodes?

To display HTML web content on iOS and Android nodes, you can use a host server and node bridge architecture that renders the content directly within a WebView on connected devices.

What is the best way to show a web dashboard on my Mac and tablet simultaneously?

Displaying a web dashboard across Mac and tablet devices is achieved by integrating network connectivity via Tailscale, which bridges the host server to connected nodes for cross-platform presentation.

Does live reload work when presenting web content on connected devices?

Yes, live reload works for web content presentation by supporting dynamic content updates, providing rapid development feedback and immediate visual refreshes across connected nodes.

Can I use this to run interactive HTML games on Mac nodes?

You can run interactive HTML games on Mac nodes by presenting the HTML file through the host server, which renders the web-based game inside the node's WebView environment.

Do I need Tailscale to display web content across multiple connected devices?

Tailscale is used for flexible binding and seamless network connectivity across devices, enabling cross-device accessibility for visualizations and dashboards over the network.

What are the limitations of rendering HTML content in a WebView on connected nodes?

Rendering HTML content in a WebView relies on a host server and node bridge architecture, meaning presentation is bound by the connected nodes' WebView capabilities and active network integration.