Index

JSON Visualiser

Paste a payload, read it properly. Format, validate, explore, and type your JSON in the browser.

JSON Visualiser is an editor and tree viewer for the JSON you deal with every day. Paste an API response, a config file, or a log line, and it is validated as you type, formatted in one keystroke, and explorable as a collapsible tree. It turns escaped strings back into JSON, generates TypeScript types from any payload, and ships with a Chrome extension that opens raw JSON responses straight into the workspace. No account, no analytics, no server.

Open JSON Visualiser Support

Free · Web · Chrome

What it does

  • Validation as you type

    The editor is CodeMirror 6 with JSON syntax highlighting and a live linter. A missing comma or a stray quote is underlined where it happens, so you fix the payload instead of hunting for it.

  • Format, minify, copy, clear

    One click pretty prints the document, another collapses it to a single line. Cmd or Ctrl and S formats from anywhere in the editor, which is the shortcut your hands already reach for.

  • Unescape in one click

    Paste the string your logger double encoded, all backslashes and quoted quotes, and Unescape turns the escape sequences back into real JSON you can read and format.

  • A tree you can walk

    Once the document is valid, the Tree View opens it as a collapsible tree. Fold the parts you do not care about and drill into the one nested key you do.

  • TypeScript types from any payload

    Generate Types reads the current document and writes the matching TypeScript interfaces, nested objects included. Copy them into your codebase and stop typing out response shapes by hand.

  • Open raw responses from Chrome

    The Chrome extension sends the JSON you are looking at in the browser, and the URL it came from, into the workspace. Large responses are streamed across in chunks and formatted as they land.

Private by design

  • Parsing, validation, formatting, and type generation all run in your browser.
  • Your workspace is saved in the browser's IndexedDB, one document per tab.
  • No account, no sign-up, no analytics, and no server that receives your JSON.
  • Workspace state for closed tabs is cleaned up automatically.

JSON Visualiser started as the tab I kept open next to every API I was debugging. Paste a payload, see it formatted, see where it breaks, fold the parts that do not matter. It has grown a few sharp tools since, but it still opens straight to an empty editor, because that is the only screen the job needs.

It is a static app on json.milind.app. There is no login and no backend. The editor is CodeMirror 6, the tree is a collapsible viewer over the parsed document, and your work is saved in the browser so a refresh or a crash does not cost you anything.

How it works

  • Paste or type JSON into the editor. Errors are underlined as you go.
  • Format with the toolbar or Cmd or Ctrl and S. Minify when you need it back on one line.
  • Unescape a double encoded string, then format it like any other document.
  • Switch to Tree View to walk the structure, or Generate Types to get TypeScript interfaces for it.

From the browser, straight in

The Chrome extension closes the loop. Hit a raw JSON endpoint, send it to JSON Visualiser, and the response opens formatted with the URL it came from. Big responses are streamed across in chunks and formatted as they land.

One document per tab

Every tab keeps its own document in IndexedDB. Open two tabs to compare two responses, close one and its state is cleaned up a few seconds later. It also installs as a progressive web app and works offline once it has loaded.

Free, with no catch

No account. No analytics. No ads. Open source on GitHub. Just a fast place to read JSON.