JSON Formatter

Key takeaways

• Formatting only changes whitespace — the data itself is untouched.
• It validates as it formats — invalid JSON is flagged with the error position.
• Choose your indentation — 2 spaces, 4 spaces, or tabs.
• 100% private — runs client-side; nothing you paste leaves your browser.

How the JSON Formatter Works

• Your input is parsed with JSON.parse() — if the JSON is invalid, the error position is highlighted so you can fix it before formatting.
• The parsed result is re-serialised with configurable indentation (2 spaces, 4 spaces, or tabs) using JSON.stringify(parsed, null, indent).
• The Repair button auto-fixes the most common issues — trailing commas, single-quoted strings, unquoted keys — before re-formatting.
• Everything runs in your browser; your JSON is never sent to a server — see is it safe to paste JSON into an online formatter?

When to Use the JSON Formatter

• When an API returns a single-line JSON response and you need to inspect specific fields.
• Before committing a JSON config file to source control — formatted JSON produces readable diffs in pull requests.
• When debugging a JSON.parse() error and you need to see the structure clearly to find the problem.
• After copying a minified JSON payload from browser DevTools and wanting to read it without squinting.

Worked example: formatting and repairing

This input isn't valid JSON — it uses single quotes, an unquoted key, and a trailing comma, the way a JavaScript object literal might. Clicking Repair fixes those, and formatting then lays it out:

Input (almost JSON)

{
  name: 'Alice',
  roles: ['admin', 'editor'],
}

Output (repaired & formatted)

{
  "name": "Alice",
  "roles": [
    "admin",
    "editor"
  ]
}

What happened

• The unquoted key name was given double quotes, and the single-quoted 'Alice' became "Alice" — JSON requires double quotes on both keys and strings.
• The trailing comma after the array was removed; JSON does not allow it.
• The array was then expanded one item per line by the 2-space formatter. Switch the indentation selector to 4 spaces or tabs to change the layout.

Edge cases & gotchas

• Repair vs Format are different steps. Formatting requires already-valid JSON and only changes whitespace. Repair fixes near-JSON (single quotes, unquoted keys, trailing commas, comments) first — reach for it when Format reports a syntax error.
• Duplicate keys collapse. {"a":1,"a":2} formats to {"a": 2} — parsing keeps only the last value for a repeated key, silently dropping the earlier one.
• Numbers are normalized. 1.0 becomes 1 and 1E2 becomes 100; the value is identical, only the text changes. Keep exact-text values (like versions) as strings.
• Large documents stay in your browser. Formatting is done locally with JSON.parse/JSON.stringify, so even a big production payload with sensitive data is never uploaded.
• Formatting is not validation against a schema. It confirms the JSON parses, not that the fields are what your app expects — use the JSON Schema Validator for that.