Back to JSON Formatter

JSON Formatter Help

Complete guide to all features, including hidden power-user capabilities

Quick Start

  1. 1Paste your JSON in the input area (or drag & drop a .json file)
  2. 2Click Format to beautify, or use ⌘ Enter
  3. 3Explore different view modes: Formatted, Tree, Schema, Diff, and more

Keyboard Shortcuts

Format JSON
+Enter
Minify JSON
+M
Repair JSON
+R
Clear input
+K
Save to favorites
+S
Show shortcuts help
+?

Replace ⌘ with Ctrl on Windows/Linux

View Modes

Formatted View

  • Syntax-highlighted JSON with Prism.js
  • Toggle line numbers on/off
  • Error line highlighting (red background)
  • Configurable indentation (2 spaces, 4 spaces, tabs)

Tree View

Power Feature
  • Expandable/collapsible tree structure
  • Color-coded types: strings, numbers, booleans, null
  • Search keys and values with highlighting
  • Double-click any value to edit inline
  • Copy paths in 5 formats (right-click copy button)

Schema View

  • Auto-generate JSON Schema (draft-07)
  • Generate TypeScript interfaces
  • Generate Zod validation schemas
  • Validate JSON against custom schemas

Diff View

  • Compare two JSON documents side-by-side
  • Color-coded: +added, -removed, ~changed
  • Shows before/after values for changes

Format Conversions

YAML

Convert JSON to YAML and back. Preserves structure and comments.

CSV

Convert arrays of objects to CSV. Import CSV data as JSON.

XML

Convert JSON to XML and back. Handles nested structures.

Advanced Features

JSONPath Query

Pro
  • Query JSON with JSONPath expressions
  • Examples: $.users[*].name, $..price
  • Click example queries to use them
  • ⌘ Enter to execute query

JSON Patch (RFC 6902)

Pro
  • Generate patches between two JSON documents
  • Operations: add, remove, replace, move, copy
  • Copy patch as JSON for API requests

Flatten/Unflatten

  • Flatten nested JSON to dot notation
  • Example: {"user":{"name":"John"}}{"user.name":"John"}
  • Unflatten back to nested structure

Code Export

  • Export as Fetch API (JavaScript)
  • Export as Axios request
  • Export as Python requests code

Hidden Features

These features aren't immediately visible but can supercharge your workflow:

JSON5 Support

Accepts comments, trailing commas, unquoted keys, single quotes, hex numbers

Auto-Decode Values

Detects JWT, Base64, timestamps, URLs, hex in string values

Right-Click Path Copy

Right-click the copy button in Tree View for format menu

Smart Type Inference

Inline edits auto-detect numbers, booleans, null

Drag & Drop Files

Drop .json files directly onto the input area

Shareable URLs

Share button creates URL with Base64-encoded JSON

Auto-Save History

Valid JSON is auto-saved after 2 seconds

Tree View Editing

Double-click values or use pencil icon to edit

Path Copy Formats

When copying paths from Tree View, choose your preferred format:

FormatExampleUse Case
Dot Notationuser.address.cityGeneral use
Bracketuser["address"]["city"]Keys with special chars
JSONPath$.user.address.cityJSONPath queries
JavaScriptdata.user.address.cityJS code
Pythondata["user"]["address"]["city"]Python code

History & Favorites

Auto-Save History

  • Valid JSON is saved automatically after 2 seconds
  • Keeps up to 20 recent items
  • Click to reload any previous JSON
  • Persists in browser localStorage

Favorites

  • Save important JSON snippets manually
  • Use ⌘ S to save current JSON
  • Add from history with one click
  • Persists across browser sessions

Auto-Repair

The Repair feature (⌘ R) can fix common JSON issues:

  • Trailing commas
  • Single quotes → double quotes
  • Unquoted keys
  • Missing closing brackets/braces
  • JavaScript comments (// and /* */)
  • undefined → null

Copy & Export Options

Formatted JSONCopy or download beautified JSON
Minified JSONSingle-line compact output
SchemaJSON Schema, TypeScript, or Zod
Converted FormatsYAML, CSV, or XML output
Query ResultsJSONPath query output
Patch OperationsRFC 6902 JSON Patch document

Need more help? Open an issue