json-canvas

Generate and manipulate JSON Canvas files with nodes and edges.

11|2|Updated Feb 3, 2026
One-click install
npx skills add https://github.com/jackjin1997/ClawForge --skill json-canvas-jackjin1997
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: json-canvas
Source: https://github.com/jackjin1997/ClawForge/tree/main/skills/json-canvas
Command: npx skills add https://github.com/jackjin1997/ClawForge --skill json-canvas-jackjin1997

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill enables the creation and editing of JSON Canvas files, which are used for visual note-taking and diagramming in applications like Obsidian.

Core Features & Use Cases

  • Node Creation: Define text, file, link, and group nodes with specific positions, dimensions, and content.
  • Edge Definition: Connect nodes with customizable edges, specifying start/end points, sides, and endpoint shapes.
  • Use Case: Generate a visual flowchart representing a software development process, including start/end points, decision branches, and task descriptions, all saved as a .canvas file.

Quick Start

Create a JSON Canvas file with a 'Main Idea' text node and two connected 'Supporting Point' text 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 JSON Canvas file for visual note-taking in Obsidian?

To create a JSON Canvas file, you define nodes like text, file, link, or group, each with specific positions and dimensions, and connect them using edges. This generates a .canvas file for visual organization in applications like Obsidian.

What is the JSON Canvas format used for?

The JSON Canvas format is used for visual note-taking and diagramming. It allows you to build mind maps and flowcharts by creating customizable nodes and edges, which are then saved as a .canvas file for use within compatible applications.

Can I customize node positions and edge connections in a .canvas file?

Yes, you can customize node positions and edge connections in a .canvas file. The format supports specifying node size, color, and content, alongside defining edge start and end points, sides, and endpoint shapes to create detailed flowcharts.

Does JSON Canvas support group nodes and file references?

Yes, JSON Canvas supports group nodes and file references. You can create text, file, link, and group nodes with specific dimensions and content, allowing you to represent complex software development processes and visual hierarchies.

What's the best way to generate a flowchart representing a software development process as a .canvas file?

The best way to generate a flowchart as a .canvas file is by creating text nodes for start and end points, decision branches, and task descriptions, then linking them with customizable edges to define the process flow visually.