Skip to content
Get packs

JSON Canvas Editor

Create and edit Obsidian .canvas files with nodes, edges, groups and connections

Source Download skill
Repository
kepano/obsidian-skills
Stars
50,606
Licence
MIT
Files
2 files

What it does

This skill teaches an AI agent the structure of JSON Canvas files, the format behind Obsidian's visual canvases. Once installed, when you ask for a mind map, flowchart or canvas, the agent writes a valid .canvas file with correctly placed text, file, link and group nodes, and connects them with edges. It also follows checks such as unique IDs and valid node references when editing existing canvases.

Great for

  • Obsidian users who want an AI to generate mind maps or flowcharts as .canvas files
  • People who maintain existing canvases and want edits done without breaking the JSON
  • Developers building tools that produce JSON Canvas 1.0 files

Skip it if

  • People who need drawing or diagramming in other tools (the output is specific to the JSON Canvas format, so other apps may not open it)
  • Situations where the canvas must be opened without validation, since the agent is asked to check references but mistakes in layout or rendering may still occur

Try asking

  • “Create a canvas mapping the main themes of my reading notes as a mind map”
  • “Add a new node titled Q3 goals to my Planning.canvas and connect it to the existing Projects node”
  • “Turn this list of steps into a flowchart canvas with arrows between each step”
  • “Change the color of all nodes in group Ideas to purple in my canvas file”
Step-by-step guide: how to use JSON Canvas EditorInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 2 original files, the MIT licence and an attribution note.

    json-canvas.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip json-canvas.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip json-canvas.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Name the exact .canvas file and the nodes or groups you want changed so the agent edits the right objects.
  • Ask the agent to validate the file afterwards and open it in Obsidian to confirm the layout looks right.
  • Back up important canvases before asking for bulk edits, since the agent rewrites the whole JSON file.

What's inside

  • references/EXAMPLES.md
  • SKILL.md

Redistributed unmodified from kepano/obsidian-skills under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.