Format JSON Online — Free Beautifier

Why Format JSON? The Case for Readable Data

JSON (JavaScript Object Notation) is the universal language of APIs and configuration files. In production, JSON is almost always minified — every byte of whitespace removed to reduce payload size. But when you need to read, debug, or edit it, minified JSON is nearly impossible to parse with human eyes. A single missing comma or extra bracket buried in a wall of characters can take hours to find.

Formatting JSON — adding newlines and consistent indentation — transforms an unreadable blob into a clear, hierarchical structure. Nested objects become visually distinct, arrays are easy to count, and errors are obvious at a glance. This is what online JSON formatters do: they take your compressed data and make it human-readable in milliseconds.

How JSON Formatting Works Under the Hood

Every JSON formatter, including this one, performs two operations: parse and then stringify. The parser (JSON.parse in JavaScript) reads the raw text and builds an in-memory data structure — a JavaScript object or array. If the JSON is invalid at any point, parsing stops and throws an error with the position of the problem.

Once parsed, the serialiser (JSON.stringify) converts the data structure back to a string, this time with controlled indentation. The indentation level is passed as the third argument:JSON.stringify(obj, null, 2) for 2 spaces, JSON.stringify(obj, null, 4)for 4 spaces, or JSON.stringify(obj, null, '\t') for tab-based indentation.

Formatting JSON in Different Languages

JavaScript / Node.js

// Format a JSON string with 2-space indentation
const raw = '{"name":"Alice","age":30,"hobbies":["reading","coding"]}';
const formatted = JSON.stringify(JSON.parse(raw), null, 2);
console.log(formatted);
// Output:
// {
//   "name": "Alice",
//   "age": 30,
//   "hobbies": [
//     "reading",
//     "coding"
//   ]
// }

// Format an existing object
const user = { name: 'Bob', roles: ['admin', 'editor'] };
console.log(JSON.stringify(user, null, 2));

Python

import json

raw = '{"name":"Alice","age":30,"hobbies":["reading","coding"]}'

# Parse the JSON string into a Python dict
data = json.loads(raw)

# Format with 4-space indentation (Python convention)
formatted = json.dumps(data, indent=4)
print(formatted)

# Format JSON from a file
with open('data.json') as f:
    data = json.load(f)
print(json.dumps(data, indent=2, ensure_ascii=False))  # ensure_ascii=False preserves Unicode

Command Line (jq)

# Format JSON file
jq . data.json

# Format JSON from stdin (e.g. curl response)
curl -s https://api.example.com/data | jq .

# Format and write to a new file
jq . raw.json > formatted.json

# jq . is the identity filter — it parses and re-prints with indentation

VS Code

# Open a .json file in VS Code, then:
# Mac: Shift + Option + F
# Windows/Linux: Shift + Alt + F

# Or via Command Palette (Cmd/Ctrl + Shift + P):
# > Format Document

# VS Code uses Prettier or the built-in JSON formatter depending on your settings.
# Set "editor.defaultFormatter": "esbenp.prettier-vscode" in settings.json for consistent results.

Common JSON Formatting Errors and How to Fix Them

1. Trailing commas

This is the most common JSON syntax error. Unlike JavaScript objects and arrays, JSON does not allow a comma after the last item.

// WRONG — trailing comma after last array item
{
  "colors": [
    "red",
    "green",
    "blue",   // <-- comma not allowed here
  ]
}

// CORRECT
{
  "colors": [
    "red",
    "green",
    "blue"
  ]
}

2. Single quotes instead of double quotes

JSON requires double quotes around all strings and property names. Single quotes work in JavaScript but not in JSON.

// WRONG
{ 'name': 'Alice' }

// CORRECT
{ "name": "Alice" }

3. Unquoted keys

// WRONG — JavaScript allows unquoted keys, JSON does not
{ name: "Alice" }

// CORRECT
{ "name": "Alice" }

4. Comments

// WRONG — JSON does not support comments
{
  "port": 8080, // server port
  "debug": true /* enable debug logging */
}

// CORRECT — remove comments entirely
{
  "port": 8080,
  "debug": true
}

// NOTE: If you need comments in config files, consider JSONC (JSON with Comments)
// supported by VS Code, or YAML which natively supports #-style comments.

JSON Indentation: 2 Spaces vs 4 Spaces vs Tabs

There is no single correct indentation style — it depends on your project conventions:

• 2 spaces — the most common choice in JavaScript, TypeScript, and React projects. Used by npm package.json, ESLint configs, and most Node.js APIs.
• 4 spaces— the Python convention (PEP 8). Also common in .NET and Java codebases. Used by Python's json.dumps default when indent=4.
• Tabs — compact on disk (one character per indent level), but the visual width varies by editor. Less common in JSON but valid. Use tabs if your project already uses tab-based indentation everywhere.

The PromptSpace JSON Formatter defaults to 2-space indentation, matching the JavaScript ecosystem convention. You can switch to 4-space or tab in the settings panel.

Formatting API Responses for Debugging

One of the most common uses for an online JSON formatter is debugging API responses. When you make a fetch() call or use curl to hit an API, the response is usually minified. Formatting it reveals exactly what data the API returned and makes it easy to identify missing fields, unexpected types, or nested structures.

# Pretty-print a curl response directly in the terminal
curl -s https://api.example.com/users/1 | python3 -m json.tool

# Or with jq
curl -s https://api.example.com/users/1 | jq .

# In Postman / Insomnia: the "Pretty" tab auto-formats the response
# In browser DevTools: the Network tab → XHR → Preview always shows formatted JSON

Key Facts

Input formats:

Raw JSON string, minified JSON, partially formatted JSON

Indentation options:

2 spaces (default), 4 spaces, tabs

Validation:

Built-in — parse errors show line + column number

Privacy:

All processing in-browser — JSON never leaves your device

Cost:

Free, no account required

Works on:

Chrome, Firefox, Safari, Edge — any modern browser

Related JSON Tools

• JSON Beautifier Online — same tool, deeper guide on beautification
• Minify JSON Online — compress formatted JSON for production
• Pretty Print JSON — language-specific pretty-print examples
• JSON Validator — validate JSON without formatting
• JSON to CSV Converter — export JSON arrays as spreadsheets
• JSON Diff Checker — compare two JSON objects side-by-side