What is a JSON Canvas file?

JSON Canvas is an open format for infinite canvas data using the .canvas extension. It is widely used in applications like Obsidian for visual note-taking and diagramming.

Is it compatible with Obsidian?

Absolutely. The skill follows the official JSON Canvas Spec 1.0, ensuring all generated files are fully compatible with the Obsidian Canvas view.

Can this skill create connections between different notes?

Yes, it can create edges with custom labels and arrows to connect text nodes, file references, and external links across the canvas.

How does the skill handle node positioning?

The skill manages X and Y coordinates along with width and height dimensions to ensure nodes are placed logically on the infinite canvas without unintended overlapping.

Does it support images and web links?

Yes, it supports 'file' nodes for local attachments like images or PDFs, and 'link' nodes for embedding external URLs directly on the canvas.

JSON Canvas Editor

Name: JSON Canvas Editor
Author: lngyneric

bylngyneric

생산성 및 워크플로

Creates and edits standardized JSON Canvas files for visual brainstorming, flowcharts, and mind mapping within Obsidian and other canvas-compatible tools.

소개

This skill empowers Claude Code to interact directly with the JSON Canvas format, an open file standard for infinite canvas data. It allows the AI to programmatically generate, update, and manage .canvas files, enabling users to transform complex ideas into visual structures like mind maps, project boards, and technical flowcharts. By strictly following the JSON Canvas Spec 1.0, the skill ensures seamless compatibility with Obsidian and other supported platforms, making it an essential tool for visual documentation, knowledge management, and structured brainstorming sessions.

주요 기능

Define complex edge connections with customizable labels, directional sides, and arrow endpoints
Apply visual styling using both hex color codes and standard canvas preset colors
0 GitHub stars
Generate valid JSON Canvas (.canvas) files following the official Spec 1.0
Create and manage diverse node types including Markdown text, local files, external links, and visual groups
Organize visual hierarchies using z-index layering and containerized group nodes

사용 사례

Automating the creation of software architecture diagrams and logic flowcharts
Building visual project dashboards and Kanban-style task boards within Obsidian
Organizing research notes, PDF attachments, and web resources into a structured visual mind map

소개

주요 기능

Define complex edge connections with customizable labels, directional sides, and arrow endpoints
Apply visual styling using both hex color codes and standard canvas preset colors
0 GitHub stars
Generate valid JSON Canvas (.canvas) files following the official Spec 1.0
Create and manage diverse node types including Markdown text, local files, external links, and visual groups
Organize visual hierarchies using z-index layering and containerized group nodes

사용 사례

Automating the creation of software architecture diagrams and logic flowcharts
Building visual project dashboards and Kanban-style task boards within Obsidian
Organizing research notes, PDF attachments, and web resources into a structured visual mind map