canvas

Name: canvas
Availability: InStock
Author: Aryan

Create, manipulate, and retrieve visual elements on an infinite workspace canvas.

Updated Mar 12, 2026

Search Tags:#design #layout #workspace #canvas #ui elements #shapes

Ready to run

npx skills add https://github.com/aryankumarrai/VarAI --skill canvas-aryankumarrai

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: canvas
Source: https://github.com/aryankumarrai/VarAI/tree/main/.local/skills/canvas
Command: npx skills add https://github.com/aryankumarrai/VarAI --skill canvas-aryankumarrai

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill allows for the creation, manipulation, and retrieval of visual elements on an infinite workspace canvas, streamlining the design and organization of digital content.

Core Features & Use Cases

Shape Management: Create, update, delete, move, and resize various shapes including geometric figures, text, notes, iframes, images, and videos.
Canvas State Reading: Retrieve the current state of the canvas, including detailed information about shapes near the viewport and summarized information for distant elements.
Use Case: Design a user interface mockup by placing text labels, image placeholders, and embedded component previews onto the canvas, then retrieve the layout to share or iterate on.

Quick Start

Use the canvas skill to create a blue rectangle at position 100, 100 with a width of 200 and a height of 150.

Frequently Asked Questions about canvas

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

FAQPage Schema

How do I create and position geometric shapes on a digital canvas?▼

To manage visual workspace elements, you can create, update, delete, move, and resize geometric shapes, text, notes, iframes, images, and videos. This allows you to dynamically design and organize digital content on an infinite canvas.

Can I embed external media like videos and iframes into my workspace layout?▼

Yes, you can embed external media like iframes, images, and videos into your workspace layout. The canvas supports manipulating these visual elements with precise positioning and sizing to facilitate dynamic interface design.

How does canvas state retrieval work for distant visual elements?▼

Canvas state retrieval works by providing detailed information for shapes near the viewport and summarized information for distant elements. This optimizes reading the workspace state when managing numerous visual elements across an infinite area.

What is the best way to design a user interface mockup with image placeholders?▼

The best way to design a user interface mockup is by placing text labels, image placeholders, and embedded component previews onto the canvas. You can then retrieve the layout to share or iterate on the UI design.

Are there limitations when managing an infinite workspace with numerous shapes?▼

When managing an infinite workspace with numerous shapes, the system provides summarized information for distant elements to optimize state retrieval. This ensures performance is maintained when the canvas is densely populated with visual elements.