Free & Open Source
Trusted by over 10000 developers around the world.

Visualize your data like never before

A powerful VS Code extension to turn your JSON, YAML, XML, and CSV files into interactive graphs.

Key Features

Everything you need to understand and visualize your data structures effectively.

Grid of file format icons including JSON, YAML, TOML, INI, CSV, HCL, XML, TSV in colorful squares

Multi-Format Support

JSON, YAML, XML, CSV, and many more.

Code editor logos: Windsurf, Cursor, and VS Code

Seamless VS Code Integration

Works right where you code – inside VS Code. No setup required.

Hierarchical tree diagram showing interconnected nodes in various colors starting from a purple root node

Instant Graphs

Explore deeply nested structures with a single click.

Three export format icons - JPG, PNG, and SVG - arranged in a triangular layout with 3D effect

Export with Ease

Export graphs as JPG, PNG or SVG with one click.

How It Works

Get started in three simple steps

Install
Get the extension from the VS Code Marketplace.
VS Code extension marketplace showing the JSONFlow extension installation page with install button
Open
Load any supported data file.
VS Code editor window showing a JSON file being opened with the JSONFlow extension
Visualize
Interact with a clean, structured node-based graph.
Interactive node-based graph visualization of a JSON structure with connected nodes and properties

Made for Developers

Real scenarios, real solutions. See how JSON Flow fits into your daily workflow.

Debug complex API responses

Quickly identify and troubleshoot nested JSON API responses with interactive graphs.

API Response

Understand configuration files

Easily parse and explore JSON configuration files with syntax highlighting and validation.

config.yaml

Teach data structures with clarity

Visualize trees, graphs, and other data structures interactively to enhance learning.

tree.toml

Collaborate using visual documentation

Share and annotate JSON workflows with your team for streamlined collaboration.

workflow.ini

Meet the Makers

JSON Flow is built and maintained by a small team of passionate developers who believe that working with structured data should be visual, intuitive, and collaborative.

M
Manuel Gil
Creator and lead developer
S
Santiago Rey
Collaborator
A
Andry Orellana
Collaborator

Ready to simplify your data workflow?

Start visualizing smarter - Install JSON Flow for free.