excalidraw-diagrams

Analyze a codebase and generate Excalidraw JSON architecture diagrams.

5|Updated Feb 18, 2018

Search Tags:#automation #architecture #codebase #excalidraw #visualization #diagram

Ready to run

npx skills add https://github.com/ebinnion/dotfiles --skill excalidraw-diagrams-ebinnion

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: excalidraw-diagrams
Source: https://github.com/ebinnion/dotfiles/tree/main/skills/excalidraw-diagrams
Command: npx skills add https://github.com/ebinnion/dotfiles --skill excalidraw-diagrams-ebinnion

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Generate architecture diagrams from a codebase analysis to visualize components, services, and relationships without manual diagramming.

Core Features & Use Cases

Analyze the codebase to identify components, services, databases, and APIs.
Automatically generate an Excalidraw-compatible diagram JSON with shapes, connectors, and labels.
Use for system overview diagrams, onboarding docs, and architecture reviews across languages and frameworks.

Quick Start

Ask Claude Code to generate an excalidraw diagram for this project.

Frequently Asked Questions about excalidraw-diagrams

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

FAQPage Schema

How do I automatically generate architecture diagrams from a codebase?▼

You can automatically generate architecture diagrams from a codebase by analyzing the source code to identify components, services, databases, and APIs, then producing a visual representation of the system relationships.

Can I create Excalidraw diagrams directly from my source code?▼

Yes, you can create Excalidraw diagrams from source code by generating valid Excalidraw JSON with dynamic IDs, proper bindings, and elbow-arrow routing to map out system components and data flows.

Does automated codebase visualization work across different programming languages?▼

Automated codebase visualization applies across languages and architectures to identify components and services, enabling you to create system overview diagrams for diverse software projects.

What is the best way to visualize microservices and data flows for architecture reviews?▼

The best way to visualize microservices and data flows for architecture reviews is to analyze your codebase to produce diagrams mapping components, services, databases, and APIs without manual diagramming.

When do I need to generate codebase architecture diagrams for onboarding?▼

You need to generate codebase architecture diagrams for onboarding when new team members require quick visualization of system components, services, and relationships to understand the project structure.