excalidraw

Generate hand-drawn style SVG and PNG diagrams from natural language prompts.

Updated Feb 15, 2026

Search Tags:#architecture #excalidraw #flowchart #drawing #visualization #diagrams

Ready to run

npx skills add https://github.com/Wbunker/skills-repo --skill excalidraw-wbunker

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: excalidraw
Source: https://github.com/Wbunker/skills-repo/tree/main/excalidraw
Command: npx skills add https://github.com/Wbunker/skills-repo --skill excalidraw-wbunker

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires roughjs, @xmldom/xmldom, @resvg/resvg-js, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill automates the creation of visual diagrams from simple text descriptions, eliminating the need for manual drawing tools and complex syntax.

Core Features & Use Cases

Text-to-Diagram Generation: Describe flowcharts, architecture diagrams, or system designs in plain English and receive a hand-drawn style visual.
Multiple Diagram Types: Supports flowcharts, architecture diagrams, system designs, and more.
Use Case: Quickly visualize a system architecture by typing /excalidraw API gateway -> auth service -> database.

Quick Start

Use the excalidraw skill to draw a diagram of a user interacting with an API gateway.

Frequently Asked Questions about excalidraw

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

FAQPage Schema

How do I generate flowcharts from text descriptions automatically?▼

To generate flowcharts from text, provide a natural language prompt describing the system. The Skill creates hand-drawn style SVG and PNG diagrams using roughjs, eliminating manual drawing steps.

Can I create architecture diagrams using plain English prompts?▼

Yes, you can create architecture diagrams by typing plain English prompts. It renders system designs into hand-drawn style SVG and PNG files, automating the visualization of system architecture.

What is the best way to visualize system designs without manual drawing tools?▼

The best way to visualize system designs without manual drawing tools is using text-to-diagram generation. Describe your flowchart or architecture in natural language to receive rendered SVG and PNG visuals.

Does this text-to-diagram generation output SVG and PNG files?▼

Yes, text-to-diagram generation outputs both SVG and PNG files. It leverages Node.js and libraries like roughjs to render your natural language descriptions into downloadable visual formats.

Do I need Node.js to render hand-drawn style diagrams from prompts?▼

Yes, you need Node.js to render hand-drawn style diagrams from prompts. The generation process relies on a Node.js environment to execute scripts and utilize rendering libraries like roughjs.