New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Excalidraw Canvas Toolkit

by lingzhi227 in lingzhi227/agent-research-skills

Draws and refines Excalidraw diagrams on a live canvas through MCP tools or a REST API, with screenshots, file import and export, snapshots and Mermaid conversion.

No licenceAuto-check passedDevelopment

Install Excalidraw Canvas Toolkit

skills CLI
$ npx skills add lingzhi227/agent-research-skills --skill excalidraw-skill -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install lingzhi227/agent-research-skills excalidraw-skill --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/lingzhi227/agent-research-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/excalidraw-skill .claude/skills/excalidraw-skill && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
excalidraw-skill
GitHub stars
390
Token cost
~3.8k tokens
SKILL.md length
1,635 words
Files
9 (incl. scripts, references)
Skills in repo
31
Repo updated
First seen
Licence
None found

At a glance

Draws and refines Excalidraw diagrams on a live canvas through MCP tools or a REST API, with screenshots, file import and export, snapshots and Mermaid conversion.

  • Works in 5 steps: Labels: Use "label": {"text": "My… → Arrow binding: Use "start": {"id":… → fontFamily: Must be a string (e.g. "1")… → …
  • Drawing an architecture or flow diagram on a live Excalidraw canvas
  • SKILL.md covers Step 0: Detect Connection Mode, Quality Gate (MANDATORY — read…, Quick Start and Workflow: Draw A Diagram, plus 9 more sections
  • Runs JavaScript scripts from its folder; calls curl, npm and node; reaches github.com

What it does

The first step is to detect how to reach the canvas. The agent looks for Excalidraw MCP tools with `mcp-cli`, falls back to the REST API by calling the canvas server's health endpoint, and if neither answers, walks you through cloning the mcp_excalidraw project, building it with npm, starting the canvas on port 3000 and optionally registering the MCP server. A table maps each MCP tool to its REST equivalent, such as batch element creation, querying, updating, clearing, scene export and import, and snapshots. Screenshots, viewport, image export and export URLs need MCP or a browser.

With the canvas available, the agent can draw, align, group, duplicate and lock elements, call `describe_scene` and `get_canvas_screenshot` to inspect its own work and refine it, and convert Mermaid to Excalidraw. Helper scripts cover health checks and creating, updating, deleting, importing and exporting elements, and a cheatsheet lists endpoints and layout guidance.

When your agent uses it

  • Drawing an architecture or flow diagram on a live Excalidraw canvas
  • Refining a diagram after looking at a screenshot of the canvas
  • Importing or exporting .excalidraw files and PNG or SVG images
  • Saving a canvas snapshot before a big layout change

Example prompts

  • “Draw our checkout flow as boxes and arrows on the Excalidraw canvas, then screenshot it and tidy the spacing.”
  • “Convert this Mermaid sequence diagram into Excalidraw elements.”
  • “Snapshot the current canvas, then align the three database boxes in a row.”

Requirements

  • A running Excalidraw canvas server, reachable at EXPRESS_SERVER_URL (default http://localhost:3000)
  • Node.js and npm to build the canvas server
  • A browser for screenshots and image export

Workflow steps

5 steps, taken from the first numbered list in SKILL.md.

  1. Labels: Use "label": {"text": "My Label"} (not "text": "My Label"). MCP tools auto-convert, REST API does not.
  2. Arrow binding: Use "start": {"id": "svc-a"}, "end": {"id": "svc-b"} (not "startElementId"/"endElementId"). MCP tools accept startElementId…
  3. fontFamily: Must be a string (e.g. "1") or omit it entirely. Do NOT pass a number like 1.
  4. Updating labels: When updating a shape via PUT /api/elements/:id, include the full label in the update body to preserve it. Omitting label…
  5. Screenshot in REST mode: POST /api/export/image returns {"data": ""}. Save to file and read it back for visual verification. Requires…

What it can do on your machine

Read from SKILL.md and the folder at commit 9e6c085. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships 7 files in scripts/ (JavaScript), which the agent can run.

    Shell commands in SKILL.md call:

    • curl
    • npm
    • node
    • git

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Hosts in commands or code, which the agent is likely to contact:

    • github.com

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Excalidraw Canvas Toolkit loads about 3.8k tokens when it runs, and up to ~5.3k if it reads all its reference files. Until then it costs about 156 tokens; SKILL.md has 1,635 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~156
When it runs · the whole SKILL.md, loaded when a task matches
~3.8k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~5.3k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.

SKILL.md

Without a licence we can't republish the file, so here is its outline and opening line. It has 1,635 words (~3,823 tokens).

“Before doing anything, determine which mode is available. Run these checks in order:”

— opening of SKILL.md by lingzhi227
name
excalidraw-skill

Read the full SKILL.md on GitHub

Files

SKILL.md and 8 other files (scripts, references) in skills/excalidraw-skill of lingzhi227/agent-research-skills.

  • SKILL.md
  • references/cheatsheet.md
  • scripts/clear-canvas.cjs
  • scripts/create-element.cjs
  • scripts/delete-element.cjs
  • scripts/export-elements.cjs
  • scripts/healthcheck.cjs
  • scripts/import-elements.cjs
  • scripts/update-element.cjs

Open the folder on GitHubat commit 9e6c085

Compare with similar skills

Excalidraw Canvas Toolkit next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Excalidraw Canvas Toolkit compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Excalidraw Canvas Toolkit this skilllingzhi227/agent-research-skills390—~3.8kAutomated safety check: PassNone
Excalidraw Skillyctimlin/mcp_excalidraw2.5k—~4.6kAutomated safety check: PassMIT
Excalidraw Diagram DesignBV-Venky/excalidraw-architect-mcp158—~1.6kAutomated safety check: PassMIT
Diagram Designcathrynlavery/diagram-design49k1 repos~7.6kAutomated safety check: PassMIT
Diagram Makergarrytan/gstack136k—~4.1kAutomated safety check: NotesMIT
Architecture Knowledge GraphBV-Venky/excalidraw-architect-mcp158—~1.1kAutomated safety check: PassMIT

Similar skills

  • Excalidraw Skill

    yctimlin/mcp_excalidraw

    Excalidraw canvas toolkit for creating, editing, and refining diagrams on a live canvas.

    2.5k GitHub stars~4.6k tokensUpdated yesterday
    DevelopmentAuto-check passed

  • Excalidraw Diagram Design

    BV-Venky/excalidraw-architect-mcp

    Guide for structuring graph input (nodes and edges) for the Excalidraw Architect MCP tool to produce clean, readable diagrams.

    158 GitHub stars~1.6k tokensUpdated 1 mo ago
    DevelopmentAuto-check passed

  • Diagram Design

    cathrynlavery/diagram-design

    Creates branded diagrams, from architecture, flowchart and sequence to charts and maps, as self-contained HTML with inline SVG, with import from draw.io, Mermaid and Excalidraw.

    49k GitHub starsUsed in 1 repo~7.6k tokens
    DevelopmentAuto-check passed

  • Diagram Maker

    garrytan/gstack

    Turns an English description or Mermaid source into a diagram set: the source, an editable .excalidraw file and rendered SVG and PNG images.

    136k GitHub stars~4.1k tokensUpdated today
    DevelopmentAuto-check: notes

  • Architecture Knowledge Graph

    BV-Venky/excalidraw-architect-mcp

    Guide for reading a codebase and building a high-quality, persistent architecture knowledge graph via the Excalidraw Architect MCP kg tools.

    158 GitHub stars~1.1k tokensUpdated 1 mo ago
    Knowledge ManagementAuto-check passed

  • GitDiagram Repository Overview

    ahmedkhaleel2004/gitdiagram

    Explains the architecture of a public GitHub repository through GitDiagram: how the code is organized, the main components with paths, and a Mermaid diagram.

    18k GitHub stars~427 tokensUpdated yesterday
    DevelopmentAuto-check passed

More from lingzhi227/agent-research-skills

All 31 skills in this repo

  • Backward Traceability

    lingzhi227/agent-research-skills

    Makes each number in a LaTeX paper link back to the code line that produced it, using hypertarget and hyperlink tags and compile-time `\num` formulas.

    390 GitHub stars~802 tokensUpdated 7 mo ago
    Auto-check passed

  • Statistical Data Analysis

    lingzhi227/agent-research-skills

    Writes statistical analysis code for experimental data, runs it through a four-round review, and reports effect sizes, p-values and confidence intervals.

    390 GitHub stars~886 tokensUpdated 7 mo ago
    Auto-check passed

  • Research Experiment Designer

    lingzhi227/agent-research-skills

    Plans research experiments in four progressive stages, from a first working implementation through baseline tuning and creative research to ablation studies.

    390 GitHub stars~752 tokensUpdated 7 mo ago
    Auto-check passed

  • Scientific Figure Generation

    lingzhi227/agent-research-skills

    Generates publication-quality scientific figures with matplotlib or seaborn through query expansion, a run-and-retry coding loop and a visual check of the rendered PNG.

    390 GitHub stars~809 tokensUpdated 7 mo ago
    Auto-check passed

  • Research Idea Generation

    lingzhi227/agent-research-skills

    Generates and iteratively refines research ideas for a given area, checking each one's novelty against Semantic Scholar and arXiv, and scoring it on interestingness, feasibility and novelty.

    390 GitHub stars~747 tokensUpdated 7 mo ago
    Auto-check passed

  • Academic LaTeX Formatter

    lingzhi227/agent-research-skills

    Sets up conference-specific LaTeX paper templates, checks a draft for formatting and submission issues, and auto-fixes common problems for venues like ICML, ICLR, NeurIPS, AAAI and ACL.

    390 GitHub stars~603 tokensUpdated 7 mo ago
    Auto-check passed

Works with

Categories

Questions about Excalidraw Canvas Toolkit

What does Excalidraw Canvas Toolkit do?

Draws and refines Excalidraw diagrams on a live canvas through MCP tools or a REST API, with screenshots, file import and export, snapshots and Mermaid conversion. The first step is to detect how to reach the canvas. The agent looks for Excalidraw MCP tools with `mcp-cli`, falls back to the REST API by calling the canvas server's health endpoint, and if neither answers, walks you through cloning the mcp_excalidraw project, building it with npm, starting the canvas on port 3000 and optionally registering the MCP server.

When should I use Excalidraw Canvas Toolkit?

Excalidraw Canvas Toolkit fits situations like: drawing an architecture or flow diagram on a live Excalidraw canvas; refining a diagram after looking at a screenshot of the canvas; importing or exporting .excalidraw files and PNG or SVG images; saving a canvas snapshot before a big layout change.

How do I install Excalidraw Canvas Toolkit in Claude Code?

Run `npx skills add lingzhi227/agent-research-skills --skill excalidraw-skill -a claude-code`. Or copy the skill folder (skills/excalidraw-skill in lingzhi227/agent-research-skills) into .claude/skills/excalidraw-skill in your project. Claude Code loads it when a task matches its description.

How do I install Excalidraw Canvas Toolkit in Codex?

Run `npx skills add lingzhi227/agent-research-skills --skill excalidraw-skill -a codex`. Or copy the skill folder (skills/excalidraw-skill in lingzhi227/agent-research-skills) into .agents/skills/excalidraw-skill in your project. Codex loads it when a task matches its description.

Can I use Excalidraw Canvas Toolkit in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add lingzhi227/agent-research-skills --skill excalidraw-skill -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/excalidraw-skill, .gemini/skills/excalidraw-skill, .github/skills/excalidraw-skill and .opencode/skills/excalidraw-skill in your project.

What does Excalidraw Canvas Toolkit need to run?

Going by SKILL.md and its folder, Excalidraw Canvas Toolkit needs JavaScript for the scripts in its folder and the command-line tools its instructions call (curl, npm, node and git). Our summary lists: A running Excalidraw canvas server, reachable at EXPRESS_SERVER_URL (default http://localhost:3000); Node.js and npm to build the canvas server; A browser for screenshots and image export.

Does Excalidraw Canvas Toolkit access the network?

SKILL.md names 1 domain. In commands or code: github.com; the agent is likely to contact it when it follows the instructions. This is read from the text; nothing was executed.

Is Excalidraw Canvas Toolkit safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.

What licence does Excalidraw Canvas Toolkit use?

No licence was found for Excalidraw Canvas Toolkit or its repository. Without one, default copyright applies: ask the author before reusing or redistributing it.

How many tokens does Excalidraw Canvas Toolkit use?

About 3.8k tokens (SKILL.md is roughly 15k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 1.4k tokens, read only when the agent opens those files.

What are the alternatives to Excalidraw Canvas Toolkit?

Skills that share tags, products or a category with Excalidraw Canvas Toolkit: Excalidraw Skill (yctimlin/mcp_excalidraw, 2.5k stars), Excalidraw Diagram Design (BV-Venky/excalidraw-architect-mcp, 158 stars), Diagram Design (cathrynlavery/diagram-design, 49k stars) and Diagram Maker (garrytan/gstack, 136k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Excalidraw Canvas Toolkit?

lingzhi227 (a GitHub user) maintains it in lingzhi227/agent-research-skills, which has 390 GitHub stars. The repository holds 31 skills in this directory. The repository was last updated on February 27, 2026.

Source: lingzhi227/agent-research-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.