json-canvas

Create JSON Canvas files with nodes, edges, and validated references.

Updated May 1, 2026

Search Tags:#nodes #flowchart #graph #edges #mind-map #json-canvas

Ready to run

npx skills add https://github.com/oguzhanguvenkaya/oguzhan_claude_code_configurations --skill json-canvas-oguzhanguvenkaya

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: json-canvas
Source: https://github.com/oguzhanguvenkaya/oguzhan_claude_code_configurations/tree/main/skills/json-canvas
Command: npx skills add https://github.com/oguzhanguvenkaya/oguzhan_claude_code_configurations --skill json-canvas-oguzhanguvenkaya

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

JSON Canvas files enable structured visual canvases (nodes, edges, groups) to be created and edited without manual JSON manipulation. They are useful for mapping ideas, workflows, or research visuals in Obsidian and similar note systems by providing a clear, repeatable structure and validation rules.

Core Features & Use Cases

Create and edit a .canvas file containing top-level nodes and edges to represent relationships.
Generate unique 16-character IDs for nodes and edges, and validate that edge references connect existing nodes.
Use cases include mind maps, flowcharts, project boards, and knowledge graphs, with examples provided in the references.

Quick Start

Create a new .canvas file with an empty structure and add a text node connected by an edge.

Frequently Asked Questions about json-canvas

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

FAQPage Schema

How do I create a JSON Canvas file structure for Obsidian?▼

JSON Canvas files enable structured visual canvases by defining top-level nodes, edges, and groups to represent relationships. They provide a clear, repeatable structure for mapping ideas, workflows, or research visuals in note systems without manual JSON manipulation.

How do I validate node IDs and edge references in a .canvas file?▼

Generating a JSON Canvas graph involves creating top-level nodes and edges to represent diagrams. You define unique 16-character IDs for nodes and edges, validate edge references against existing nodes, and specify types and layout for flowcharts or mind maps.

Can I use JSON Canvas to build mind maps and project boards?▼

You need an environment like Obsidian that supports the .canvas file format. The Skill generates the JSON structure with nodes and edges, which requires no external dependencies or modules to validate IDs and edge references.

What's the best way to generate unique IDs for JSON Canvas nodes?▼

Using JSON Canvas for visual notes avoids manual JSON editing by providing a repeatable structure with validation rules. It differs from general graph tools by generating specific .canvas files with validated 16-character node IDs and edge references.

Why do my JSON Canvas edge references fail to connect nodes?▼

Limitations arise if edge references point to non-existent node IDs. The Skill validates these connections and requires correct 16-character ID generation, but complex layout rendering depends on the host application like Obsidian rather than the JSON structure itself.