From oh-my-daily-skills
Generates Excalidraw hand-drawn diagrams for architecture, flowcharts, swimlanes, timelines, sequences, wireframes, ERDs, state machines, matrices, trees, and CI/CD pipelines. Outputs editable .excalidraw files.
npx claudepluginhub shiqkuangsan/oh-my-daily-skillsThis skill uses the workspace's default tool permissions.
Create professional hand-drawn style diagrams with Excalidraw, outputting `.excalidraw` files.
references/element-ref.mdreferences/examples/01-flowchart.mdreferences/examples/02-architecture.mdreferences/examples/03-sequence.mdreferences/examples/04-swimlane.mdreferences/examples/05-erd.mdreferences/examples/06-state-machine.mdreferences/examples/07-matrix.mdreferences/examples/08-tree.mdreferences/examples/09-cicd-pipeline.mdGenerates hand-drawn Excalidraw diagrams for sketch-style architecture, system designs, concept maps, and user flows. Outputs embeddable files for Obsidian or standalone use.
Generates Excalidraw diagrams from natural language including flowcharts, mind maps, architectures, ER diagrams, and sequence diagrams. Outputs editable .excalidraw JSON files.
Generates Excalidraw JSON diagram files (.excalidraw) for visualizing workflows, architectures, and concepts as visual arguments with evidence artifacts for technical diagrams.
Share bugs, ideas, or general feedback.
Create professional hand-drawn style diagrams with Excalidraw, outputting .excalidraw files.
| Type | Use Cases |
|---|---|
| Architecture | System design, microservices, layered architecture |
| Flowchart | Business processes, approval workflows, deployment flows |
| Swimlane | Multi-role collaboration, cross-department processes, quarterly roadmaps |
| Timeline | Gantt-style roadmaps, milestone schedules, release plans |
| Sequence | API calls, message flows |
| Wireframe | UI prototypes, page layouts |
| ERD / Data Model | Database schema, entity relationships, API object models |
| State Machine | Order/payment lifecycle, auth states, retry/backoff flows |
| Matrix | Feature comparison, permission matrix, RACI, migration readiness |
| Tree / Hierarchy | Component tree, directory structure, org chart, mind map |
| CI/CD Pipeline | Build→Test→Deploy flows, release gates, environment promotion |
# Example user requests
"Draw a microservices architecture with gateway, user service, order service"
"Create an approval flowchart"
"Draw a login sequence diagram"
"Draw an ERD for user, order, product tables"
"Create a state machine for order lifecycle"
"Make a feature comparison matrix"
"Draw a component tree for the dashboard module"
"Draw a CI/CD pipeline with staging and production"
Output files can be opened and edited at excalidraw.com.
Business Style (default):
| Purpose | Color |
|---|---|
| Primary | #1e3a5f |
| Secondary | #4a90d9 |
| Background | #f1f5f9 |
| Accent | #10b981 |
| Border | #6b7b8c |
Minimal Style: Primary #1f2937, Border #9ca3af, Background #ffffff
| Type | Shape | Usage |
|---|---|---|
| Core Component | Rounded Rectangle | Services, modules |
| Process Node | Rectangle | Steps, actions |
| Decision Point | Diamond | Conditions, branches |
| Data Source | Cylinder | Databases |
| Start/End | Ellipse | Start, end |
| Style | Usage |
|---|---|
| Solid Arrow | Main flow |
| Dashed Arrow | Optional/async |
| Bidirectional Arrow | Two-way calls |
references/element-ref.md → Grid Layout Calculation)references/element-ref.md → Semantic Color Coding)references/examples/; use semantic IDs for 10+ elements.excalidraw file| File | Content |
|---|---|
references/element-ref.md | Element properties, text binding formulas, grid layout calculation, semantic colors, ID conventions, troubleshooting |
Example files (read only the one matching the diagram type):
| File | Diagram Type |
|---|---|
references/examples/01-flowchart.md | Flowchart |
references/examples/02-architecture.md | Architecture |
references/examples/03-sequence.md | Sequence |
references/examples/04-swimlane.md | Swimlane / Timeline |
references/examples/05-erd.md | ERD / Data Model |
references/examples/06-state-machine.md | State Machine |
references/examples/07-matrix.md | Matrix / Comparison Table |
references/examples/08-tree.md | Tree / Hierarchy |
references/examples/09-cicd-pipeline.md | CI/CD Pipeline |