Excalidraw Generator: A Comprehensive Review of the AI-Powered Diagramming Skill
Overview
Excalidraw Generator is an open-source Claude Code skill that transforms natural language descriptions into fully-formed .excalidraw diagram files. Developed by lexiaoyao20, the tool bridges the gap between conversational AI and professional diagramming by automating layout calculation, element placement, and style application—eliminating the need for manual drawing or copy-paste workflows.
Unlike standalone diagramming tools, this skill operates as an extension within Claude Code, leveraging the agent's natural language understanding to produce valid, ready-to-open Excalidraw JSON files. The project is distributed under the MIT License, aligning with the open-source ethos of the Excalidraw ecosystem.
Key Features at a Glance
| Feature | Description |
|---|---|
| Multiple Diagram Types | Flowcharts, Architecture Diagrams, UML Class Diagrams, Mind Maps |
| Dual Visual Styles | Professional Mode (clean, polished) and Hand-drawn Mode (sketch-style) |
| Smart Layout | Automatic layout calculation with precise spacing and alignment |
| Direct File Output | Generates .excalidraw files ready to open in Excalidraw |
| Multi-language Support | Works with both English and Chinese descriptions |
| Template-Driven | Uses predefined templates for consistent, professional output |
| Security Audited | Passed third-party security audit with SAFE rating |
Source: GitHub repository
Supported Diagram Types
The skill covers the four most common diagramming needs, each with dedicated templates and layout logic:
| Diagram Type | Description | Primary Use Case |
|---|---|---|
| Flowchart | Process flows, decision trees | Algorithm visualization, business processes |
| Architecture | System designs, component diagrams | Software architecture, infrastructure |
| UML Class | Class hierarchies, relationships | Object-oriented design |
| Mind Map | Concept maps, brainstorming | Ideas exploration, knowledge mapping |
Each diagram type is built from a template located in the assets/ directory, ensuring consistency while allowing element-level customization.
Visual Styles: Professional vs. Hand-drawn
One of the skill's most practical features is its dual-mode styling system. The mode is selected through natural language cues, making it accessible without technical configuration.
| Style | When to Use | How to Request |
|---|---|---|
| Professional (Default) | Technical docs, presentations | Just describe what you need |
| Hand-drawn | Brainstorming, informal sharing | Add "手绘风格" or "hand-drawn style" |
The color palettes differ significantly between modes. Professional mode uses subdued, documentation-friendly colors (e.g., #e7f5ff for primary), while hand-drawn mode employs more vibrant, sketch-like tones (e.g., #a5d8ff for primary). This attention to visual consistency ensures diagrams integrate seamlessly into their intended context.
Technical Architecture
The skill operates through a disciplined four-phase workflow: Understand the request, Propose options, Generate the JSON, and Validate before writing the file. This structured approach minimizes errors and ensures output quality.
Layout Calculation
The skill employs a grid-based layout system with a 20-pixel grid unit for alignment. Standard element dimensions are predefined:
| Element | Width | Height | Use Case |
|---|---|---|---|
| Small box | 120 | 60 | Labels, simple steps |
| Standard box | 160 | 80 | Process steps |
| Large box | 200 | 100 | Detailed nodes |
| Wide box | 240 | 80 | Long text |
| Diamond | 100 | 100 | Decision points |
| Circle | 80 | 80 | Start/End nodes |
Source: SkillsMP documentation
Text height is calculated using the formula textHeight = fontSize × 1.25 × numberOfLines, ensuring containers automatically accommodate multi-line labels.
JSON Schema Compliance
The output strictly adheres to the Excalidraw JSON schema, including proper type, version, source, and elements fields. Coordinate positioning follows a top-left origin with X increasing rightward and Y increasing downward, measured in pixels.
Installation
The skill offers two installation pathways:
Method 1: Marketplace (Recommended)
/plugin marketplace add lexiaoyao20/excalidraw-generator
/plugin install excalidraw-generator@excalidraw-generator
Method 2: Manual Installation
git clone https://github.com/lexiaoyao20/excalidraw-generator.git
cp -r excalidraw-generator/skills/excalidraw-generator ~/.claude/skills/
After installation, restarting Claude Code loads the skill.
Usage Examples
The skill responds to natural language prompts in both English and Chinese. Representative examples include:
- Flowchart: "Create an Excalidraw flowchart for user login process"
- Architecture: "Generate an Excalidraw architecture diagram for MVVM pattern"
- UML Class: "Draw an Excalidraw UML class diagram for UIView"
- Mind Map: "用 Excalidraw 画一个项目规划的思维导图"
Generated files can be opened directly at excalidraw.com via the "Open from your computer" option.
User Ratings & Feedback
The skill has received generally positive feedback from early adopters. On the 虾评 (Xiaping) skill review platform, it holds a 4.3/5.0 rating across multiple evaluations.
| Evaluation Criteria | Score (out of 5) |
|---|---|
| Functionality | 5.0 |
| Effectiveness | 4.0 |
| Scarcity | 3.0 |
| Ease of Use | 5.0 |
| Stability | 4.0 |
One reviewer noted: "功能完整、文档详尽的图表生成技能" (A functionally complete diagram generation skill with thorough documentation). Another highlighted the Obsidian integration: "Obsidian用户可以直接在笔记中使用，非常方便" (Obsidian users can use it directly in their notes, which is very convenient).
Security & Trust
The skill has undergone independent security auditing. Agent Trust Hub rated the risk level as SAFE, confirming that the skill:
- Contains no network access or shell command execution capabilities
- Uses only static templates and mathematical calculations
- Has no prompt injection markers or obfuscated commands
- Is restricted to data generation within the Excalidraw JSON schema.
Additionally, the skill passed clean scans from Trivy, Semgrep, and mcp-scan (Snyk) on the SkillsAuth platform.
Pros and Cons
| Pros | Cons |
|---|---|
| Zero-cost, open-source MIT license | Requires Claude Code environment |
| Supports both English and Chinese | Limited to four diagram types |
| Dual visual styles for different contexts | No direct PNG/SVG export (must open in Excalidraw) |
| Template-driven, consistent output | Arrow positioning may need manual fine-tuning |
| Security-audited and safe | Smaller community compared to standalone tools |
Direct .excalidraw file output |
Documentation primarily in Chinese |
| Obsidian and VS Code compatibility | No ER diagrams or sequence diagrams (yet) |
Alternatives
| Tool | Key Difference |
|---|---|
| Excalidraw AI (official) | Integrated directly into excalidraw.com; no Claude Code required |
| mcp-diagram-generator | MCP server supporting Draw.io, Mermaid, and Excalidraw |
| drawmode | Code Mode MCP server with Sugiyama auto-layout |
| maaker-ai/excalidraw-mcp | Supports 25+ diagram types with CJK support |
The official Excalidraw AI tool is the closest alternative, but it lacks the multi-language support and template-driven workflow that distinguishes lexiaoyao20's skill.
Conclusion
Excalidraw Generator is a well-architected, security-conscious skill that delivers on its promise of converting natural language into professional Excalidraw diagrams. Its dual-style system, template-driven approach, and multi-language support make it particularly valuable for technical writers, developers, and note-takers using Obsidian or Claude Code.
The skill's primary limitation is its ecosystem lock-in—it requires Claude Code to function, which may deter users who prefer standalone tools. Additionally, the absence of sequence diagrams and ER diagrams leaves some common diagramming needs unmet. However, for its target audience, it fills a clear gap: eliminating the friction between conceptual thinking and visual representation.
Verdict: A solid 4/5 for Claude Code users seeking automated Excalidraw diagram generation. The security audit, active maintenance, and clean output format inspire confidence, while the open-source license ensures transparency and community contribution.