JSON Canvas is an open-source file format (.canvas) for infinite canvas data, used primarily by Obsidian and other visual thinking tools to store nodes and connections.

Can Claude create Obsidian-compatible diagrams with this skill?

Yes, this skill follows the official JSON Canvas Spec 1.0, ensuring any file created can be opened and edited natively within Obsidian's Canvas view.

Can I use custom colors for my mind maps?

Yes, the skill supports both the six standard preset colors (Red, Orange, Yellow, Green, Cyan, Purple) and custom Hex color codes.

Does it support linking to local files?

Yes, the skill can create 'file' nodes that reference images, PDFs, videos, or other Markdown notes within your file system or vault.

How does the skill handle node overlapping?

The skill manages X/Y coordinates and width/height attributes to ensure nodes are placed logically. It also uses z-index ordering to manage how nodes overlap visually.

JSON Canvas Manager

Name: JSON Canvas Manager
Author: hviwen

byhviwen

0•

生産性とワークフロー

Creates and manages interactive visual canvases, mind maps, and flowcharts using the open-source JSON Canvas format.

This skill empowers Claude to architect and modify .canvas files, a versatile open format used by Obsidian and other visual thinking tools. It handles the complex positioning of text nodes, file references, and external links, while managing logical connections through edges and organizational containers called groups. Whether building complex flowcharts, mind maps, or project boards, this skill ensures technical compliance with the JSON Canvas Spec 1.0, including precise coordinate management, z-index layering, and proper Markdown escaping for seamless integration into personal knowledge management workflows.

主な機能

01Automated coordinate calculation for organized visual layouts

02Obsidian-compatible color presets and hex styling for nodes and edges

03Full support for text, file, link, and group node types

04Precise edge management with custom endpoints, labels, and directional sides

05Strict adherence to JSON Canvas Spec 1.0 for cross-app compatibility

060 GitHub stars

ユースケース

01Visualizing project architectures and documentation structures within an Obsidian vault

02Creating automated task boards with grouped containers for agile workflows

03Generating complex mind maps and brainstorming diagrams directly from chat prompts

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add hviwen/mosaic-photo json-canvas

For use in Claude.ai and ChatGPT

Download Skill