canvas

Present and control HTML content on connected Bitterbot nodes via canvas host.

2.5k|423|Updated Mar 28, 2026
One-click install
npx skills add https://github.com/Bitterbot-AI/bitterbot-desktop --skill canvas-bitterbot-ai
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: canvas
Source: https://github.com/Bitterbot-AI/bitterbot-desktop/tree/main/skills/canvas
Command: npx skills add https://github.com/Bitterbot-AI/bitterbot-desktop --skill canvas-bitterbot-ai

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Display and control HTML content on connected Bitterbot nodes (Mac, iOS, Android) via the canvas host server. Use when presenting games, visualizations, dashboards, or interactive demos on a connected device, navigating canvas URLs, capturing canvas snapshots, or debugging canvas connectivity.

Core Features & Use Cases

  • Present: Show HTML content on a node's canvas view.
  • Navigate: Change the displayed content by URL.
  • Snapshot: Capture screenshots of the canvas.
  • Eval: Execute JavaScript within the canvas context.
  • Debugging: Diagnose connectivity issues between host, bridge, and nodes.
  • Use Case: Deliver interactive demos on mobile devices during a live presentation.

Quick Start

Use the canvas skill to present a page on a connected node's canvas.

Frequently Asked Questions about canvas

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

FAQPage Schema
How do I display HTML content on connected mobile and desktop devices?

You can display HTML content on connected Mac, iOS, and Android devices by using the canvas host to present pages via WebView rendering. This requires a configured host server on port 18793 and a node bridge.

Can I execute JavaScript and navigate URLs within a presented web demo?

Yes, you can execute JavaScript within the canvas context using the eval action, and navigate to new URLs using the navigate action. These controls allow interactive updates during live presentations on connected nodes.

What is the best way to capture screenshots of HTML content displayed on remote nodes?

The best way to capture screenshots of remote HTML content is using the snapshot action. It captures the current state of the canvas view on connected Mac, iOS, or Android nodes for debugging or recording purposes.

Does presenting interactive dashboards on mobile require a specific network configuration?

Presenting interactive dashboards on mobile requires a configured canvas host server running on port 18793 and an active bridge connecting the host to the target iOS or Android nodes for WebView rendering.

Why is my HTML content not updating on the connected canvas during a live presentation?

If HTML content is not updating on the canvas, check the connectivity between the host server, bridge, and nodes. Use the debugging capabilities to diagnose connection issues, and ensure the navigate or eval actions are correctly targeting the active WebView.