Json Canvas
Build and modify valid JSON Canvas files that power infinite canvas applications like Obsidian. Supports four node types—text, file, link, and group—plus edges with customizable endpoints and labels. Position elements precisely, apply colors, and organize content visually.
Json Canvas creates and edits JSON Canvas files (.canvas) with nodes, edges, and groups for visual organization.
AI-generated summary based on this skill's SKILL.md
Decision gist · record as of 2026-06-08
Json Canvas creates and edits JSON Canvas files (.canvas) with nodes, edges, and groups for visual organization. Build and modify valid JSON Canvas files that power infinite canvas applications like Obsidian. Supports four node types—text, file, link, and group—plus edges with customizable endpoints and labels. Position elements precisely, apply colors, and organize content visually.
Use it when
- Json Canvas enables you to visualize and render JSON data on an HTML canvas by converting JSON structures into canvas-based graphics.
- Json Canvas supports four node types: text nodes for displaying information, file nodes for referencing files.
Install
freestylefly/canghe-skills/json-canvas · repository language: TypeScript
generated, unverified - the skill's exact subdirectory could not be determined; check the repository on GitHub
Open directory. Skills are indexed for reading, not audited. Review a skill's body before installing it.
Frequently asked questions
AI-generated answers based on this skill's SKILL.md and metadata
What is Json Canvas and what can it do?
Json Canvas is a tool for building and modifying valid JSON Canvas files that power infinite canvas applications like Obsidian. It supports four node types—text, file, link, and group—plus edges with customizable endpoints and labels. You can position elements precisely, apply colors, and organize content visually on a canvas.
How do I visualize JSON on canvas with Json Canvas?
Json Canvas enables you to visualize and render JSON data on an HTML canvas by converting JSON structures into canvas-based graphics. The tool lets you transform your JSON data into interactive visual representations, making it easy to see and work with complex data structures in a graphical format.
What node types does Json Canvas support?
Json Canvas supports four node types: text nodes for displaying information, file nodes for referencing files, link nodes for creating connections, and group nodes for organizing related elements. Each node type can be positioned, colored, and connected with customizable edges that include endpoints and labels.
Can I use Json Canvas for interactive JSON data display?
Yes, Json Canvas supports interactive JSON data display on canvas. You can use it to create dynamic, canvas-based visualizations where you interact with your JSON data, modify node positions and properties, apply custom colors, and organize your content visually within an infinite canvas environment.
How do I render JSON canvas and integrate it into projects?
Json Canvas generates valid JSON Canvas files compatible with infinite canvas applications like Obsidian. You can integrate Json Canvas functionality into your projects by using the files it creates, leveraging the supported node types and edge customization options to build canvas-based JSON viewers and visualization tools.
What makes Json Canvas a JSON visualization and rendering tool?
Json Canvas converts JSON structures into canvas-based graphics, functioning as both a JSON visualization tool and rendering engine. It provides a complete solution for transforming JSON data into interactive canvas displays with precise positioning, color customization, and organizational capabilities for complex data representation.
Let your AI agent find skills like this
Example. Real query, live index.
You found this page by searching. An agent finds it by wishing: SkillFed indexes 56,283 agent skills by what they can do, searchable in plain language.
wish › “Visualize and render JSON data on an HTML canvas”
Give your agent the search over MCP, or paste the wish link into any chat. No install? Search from any chat →
Related skills
This skill enables you to build and modify .canvas files following the JSON Canvas Spec 1.0, working with nodes, edges, groups, and visual layouts. Handle text, file, link, and group node types while managing connections, colors, and positioning across an infinite canvas.
Build and modify .canvas files following the JSON Canvas Spec 1.0, adding text, file, link, and group nodes with precise positioning and connections. Manage edges between nodes, apply colors, and validate your canvas structure to ensure all references resolve correctly.
Turn any text content into structured Obsidian Canvas visualizations using mind map or freeform layouts. The skill analyzes your input, determines the best layout approach, and generates a ready-to-import JSON canvas with proper spacing, color coding, and hierarchical organization.
Build flowcharts, wireframes, system diagrams, and other visual documentation in Excalidraw's distinctive hand-drawn style. The skill outputs .excalidraw.json files that open directly in Excalidraw or any compatible viewer, handling layout, positioning, text centering, and arrow routing automatically.
Canghe Infographic transforms your content into polished, ready-to-publish visuals by pairing information structures with aesthetic treatments. Choose from 20 layout types—timelines, comparisons, hierarchies, and more—and 17 visual styles ranging from hand-drawn to technical schematics. The skill analyzes your material, recommends optimal combinations, and outputs finished infographics.
Canghe Article Illustrator examines article structure to pinpoint where visuals strengthen comprehension, then generates tailored illustrations using a two-dimensional approach: Type (infographic, scene, flowchart, comparison, framework, timeline) controls information structure, while Style (notion, warm, minimal, blueprint, watercolor, elegant) shapes visual aesthetics. Configure density and style preferences once, then let the skill handle positioning, prompt creation, and image generation end-to-end.