skilld
All skills
axtonliu avatar

/excalidraw-diagram

@1265976
by Axtonaxtonliu/axton-obsidian-visual-skills3.6k stars
324

Generate Excalidraw diagrams from text content. Supports three output modes - Obsidian (.md), Standard (.excalidraw), and Animated (.excalidraw with animation order). Triggers on "Excalidraw", "画图", "流程图", "思维导图", "可视化", "diagram", "标准Excalidraw", "standard excalidraw", "Excalidraw动画", "动画图", "animate".

Ask your Agent

Use this Skill: https://skilld.dev/gh/axtonliu/axton-obsidian-visual-skills/excalidraw-diagram

This session only. Nothing lands on disk.

referencesexcalidraw-schema.md

≈817 tokens on demand. Your agent reads this file only when SKILL.md points to it.

Excalidraw JSON Schema Reference

Color Palette

Primary Colors

Purpose Color Hex
Main Title Deep Blue #1e40af
Subtitle Medium Blue #3b82f6
Body Text Dark Gray #374151
Emphasis Orange #f59e0b
Success Green #10b981
Warning Red #ef4444

Background Colors

Purpose Color Hex
Light Blue Background #dbeafe
Light Gray Neutral #f3f4f6
Light Orange Highlight #fef3c7
Light Green Success #d1fae5
Light Purple Accent #ede9fe

Element Types

Rectangle

{
  "type": "rectangle",
  "id": "unique-id",
  "x": 100,
  "y": 100,
  "width": 200,
  "height": 80,
  "strokeColor": "#1e40af",
  "backgroundColor": "#dbeafe",
  "fillStyle": "solid",
  "strokeWidth": 2,
  "roughness": 1,
  "opacity": 100,
  "roundness": { "type": 3 }
}

Text

{
  "type": "text",
  "id": "unique-id",
  "x": 150,
  "y": 130,
  "text": "Content here",
  "fontSize": 20,
  "fontFamily": 5,
  "textAlign": "center",
  "verticalAlign": "middle",
  "strokeColor": "#1e40af",
  "backgroundColor": "transparent"
}

Arrow

{
  "type": "arrow",
  "id": "unique-id",
  "x": 300,
  "y": 140,
  "width": 100,
  "height": 0,
  "points": [[0, 0], [100, 0]],
  "strokeColor": "#374151",
  "strokeWidth": 2,
  "startArrowhead": null,
  "endArrowhead": "arrow"
}

Ellipse

{
  "type": "ellipse",
  "id": "unique-id",
  "x": 100,
  "y": 100,
  "width": 120,
  "height": 120,
  "strokeColor": "#10b981",
  "backgroundColor": "#d1fae5",
  "fillStyle": "solid"
}

Diamond

{
  "type": "diamond",
  "id": "unique-id",
  "x": 100,
  "y": 100,
  "width": 150,
  "height": 100,
  "strokeColor": "#f59e0b",
  "backgroundColor": "#fef3c7",
  "fillStyle": "solid"
}

Line

{
  "type": "line",
  "id": "unique-id",
  "x": 100,
  "y": 100,
  "points": [[0, 0], [200, 100]],
  "strokeColor": "#374151",
  "strokeWidth": 2
}

Full JSON Structure

{
  "type": "excalidraw",
  "version": 2,
  "source": "https://excalidraw.com",
  "elements": [
    // Array of elements
  ],
  "appState": {
    "gridSize": null,
    "viewBackgroundColor": "#ffffff"
  },
  "files": {}
}

Font Family Values

Value Font Name
1 Virgil (hand-drawn)
2 Helvetica
3 Cascadia
4 Assistant
5 Excalifont (recommended)

Fill Styles

  • solid - Solid fill
  • hachure - Hatched lines
  • cross-hatch - Cross-hatched
  • dots - Dotted pattern

Roundness Types

  • { "type": 1 } - Sharp corners
  • { "type": 2 } - Slight rounding
  • { "type": 3 } - Full rounding (recommended)

Element Binding

To connect text to a container:

{
  "type": "rectangle",
  "id": "container-id",
  "boundElements": [{ "id": "text-id", "type": "text" }]
}
{
  "type": "text",
  "id": "text-id",
  "containerId": "container-id"
}

Arrow Binding

To connect arrows to shapes:

{
  "type": "arrow",
  "startBinding": {
    "elementId": "source-shape-id",
    "focus": 0,
    "gap": 5
  },
  "endBinding": {
    "elementId": "target-shape-id",
    "focus": 0,
    "gap": 5
  }
}

Source: SKILL.md on GitHub

Third-party checks

No alerts15d5 checks · Risk SAFE
  • Gen Agent Trust Hub15d

    The skill is safe. It allows the agent to generate Excalidraw diagrams from text descriptions and save them locally in Obsidian Markdown or standard JSON formats. It follows strict design rules and contains no malicious code, obfuscation, or data exfiltration patterns.

  • Socket15d

    No alerts

  • Snyk15d

    Risk: LOW · No issues

  • Runlayer7mo

    1/2 files flagged

  • ZeroLeaks5mo

    1 finding · Score: 86/100

Provenance

Signed by skilld at 1265976. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub 5 months ago.

Steadyupdated 8 months ago

Capability

metadata
{
  "version": "1.2.1"
}

Topics

  • excalidraw
  • obsidian
  • diagram
  • flowchart
  • mind-map
  • visualization
  • animation
  • json

README badge

README badge for axtonliu/axton-obsidian-visual-skills

What it does

Generates Excalidraw diagrams in three output modes: Obsidian markdown (.md), Standard JSON (.excalidraw), and Animated with playback order (.excalidraw with customData). Detects output mode from trigger words, analyzes content structure, applies design rules (fontFamily 5, color palette, minimum 14px font), and auto-saves to the current working directory.

Generated from the current SKILL.md.

Frequently asked

What output formats does this skill support?
Three modes: Obsidian (.md) for direct viewing in Obsidian, Standard (.excalidraw) for excalidraw.com, and Animated (.excalidraw with animation order) for excalidraw-animate.
How does the skill choose which diagram type to generate?
It analyzes the input content to identify concepts and relationships, then selects from eight types: flowchart, mind map, hierarchy, relationship, comparison, timeline, matrix, or freeform.
What text replacement rules are applied in generated diagrams?
Double quotes are replaced with 『』 and parentheses with 「」. All text uses fontFamily 5 (Excalifont handwriting style) with minimum font sizes: 20px for titles, 16px for body text, 14px for notes only.
Does this skill support animation?
Yes, in Animated mode each element gets a customData.animate field with order and duration values. Generated files can be dragged to excalidraw-animate to preview and export animations.
Where are generated files saved?
Files are automatically saved to the current working directory with naming format [topic].[type].[extension], e.g. business-model.relationship.md for Obsidian mode.

Generated from the current SKILL.md. These answers refresh after source changes.