json-canvas

Generate and edit JSON Canvas documents with nodes and edges per Spec 1.0.

Updated May 26, 2026
One-click install
npx skills add https://github.com/Peiwvy/myskills --skill json-canvas-peiwvy
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: json-canvas
Source: https://github.com/Peiwvy/myskills/tree/main/json-canvas
Command: npx skills add https://github.com/Peiwvy/myskills --skill json-canvas-peiwvy

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It removes the guesswork of hand-authoring valid JSON Canvas (.canvas) by providing a structured way to generate, edit, and validate canvas data for visual planning and documentation.

Core Features & Use Cases

  • Create and edit JSON Canvas (.canvas) files: Build canvases containing nodes and edges that conform to the JSON Canvas Spec 1.0.
  • Model rich canvas content: Use text, file, link, and group nodes to represent concepts, attachments, external references, and visual containers.
  • Connect and organize with edges and styling: Define connections with fromNode/toNode, optional sides/arrow endpoints, labels, and color presets or hex colors.
  • Use case: When you need a mind map, flowchart, project overview, or research canvas inside Obsidian, generate a correctly structured .canvas file that renders as intended.

Quick Start

Use the json-canvas skill to create a valid .canvas file that contains text nodes, a few linked file references, and edge connections between the nodes.

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 valid JSON Canvas file for Obsidian?

To create a valid JSON Canvas file, generate structured nodes and edges that conform to JSON Canvas Spec 1.0. This process converts user intent into a structured graph, producing a correctly formatted .canvas document that renders properly in Obsidian.

What is JSON Canvas used for in visual knowledge work?

JSON Canvas is used to model visual knowledge work by creating mind maps, flowcharts, project boards, and research canvases. It uses text, file, link, and group nodes to represent concepts, attachments, and external references within a structured graph.

Can I use JSON Canvas with apps other than Obsidian?

Yes, JSON Canvas works with Obsidian and other JSON Canvas-compatible apps. The .canvas files follow an open spec, allowing you to create valid JSON documents containing nodes and edges that can be imported across different supporting platforms.

How do I connect nodes and apply styling in a .canvas file?

You connect nodes by defining edges with fromNode and toNode references, and apply styling using color presets or hex colors. Optional attributes allow you to specify connection sides, arrow endpoints, and labels for detailed graph organization.

Why does my hand-authored JSON Canvas file not render correctly?

Hand-authored JSON Canvas files often fail to render due to invalid node or edge schemas. Generating .canvas files programmatically ensures strict adherence to JSON Canvas Spec 1.0, validating ID references and structural requirements to render as intended.