Docify

By Docify

How to Format JSON Online: Parse and Prettify

• 5 min read

To format JSON online, paste the text into a browser tool that runs JSON.parse and then JSON.stringify. Docify’s formatter prettifies with 2-space indentation, minifies to one line, and reports the parser error if the text is not standard JSON — no comments, trailing commas, or JSON5. Load sample fills the compact object {"name":"John Doe","age":30,"email":"john@example.com","address":{"street":"123 Main St","city":"New York","country":"USA"},"hobbies":["reading","coding","gaming"]} and does not run Prettify, Minify, or Validate. Prettify then writes the matching 2-space JSON { "name": "John Doe", "age": 30, "email": "john@example.com", "address": { "street": "123 Main St", "city": "New York", "country": "USA" }, "hobbies": [ "reading", "coding", "gaming" ] }. age is the number 30. This is not the older users / Jane Smith / total leftover. A complete exponent such as 1e309 overflows to Infinity; Prettify, Minify, and Validate then write null. 1e308 stays finite. 1e-324 underflows to 0. Nothing is uploaded.

Minified API payloads and one-line config files are hard to read. Formatting does not need a server: the browser already ships a JSON parser. The steps below use that parser, then point at the live JSON formatter. Load sample fills the leftover compact John Doe object and does not run Prettify. Prettify then writes that matching 2-space JSON.

Load sample Prettify leftovers

Load sample fills this compact object and does not run Prettify. Prettify then writes the matching 2-space JSON. age is the number 30. This is not the older users / Jane Smith leftover.

{"name":"John Doe","age":30,"email":"john@example.com","address":{"street":"123 Main St","city":"New York","country":"USA"},"hobbies":["reading","coding","gaming"]}
{ "name": "John Doe", "age": 30, "email": "john@example.com", "address": { "street": "123 Main St", "city": "New York", "country": "USA" }, "hobbies": [ "reading", "coding", "gaming" ] }

Why Format JSON?

  • 👁️Readability - Formatted JSON is much easier to read and understand
  • 🐛Debugging - Spot errors and issues quickly in properly indented JSON
  • 📝Code reviews - Share clean, readable JSON with your team
  • ✅Validation - A failed parse is an immediate syntax error

How to Format JSON in 3 Easy Steps

Step 1: Copy Your JSON

Copy the JSON data you want to format from your API response, file, or anywhere else. It can be minified, compressed, or messy.

{"name":"John Doe","age":30,"email":"john@example.com","address":{"street":"123 Main St","city":"New York","country":"USA"},"hobbies":["reading","coding","gaming"]}

Step 2: Paste into the JSON Formatter

Open the Docify JSON formatter and paste the text. Click Prettify to run JSON.parse and JSON.stringify with 2-space indentation. Load sample fills the leftover compact John Doe object and does not run Prettify. The page does not upload the text.

Step 3: Copy Formatted Result

Copy the output and use it in an editor, a review, or docs. The values are the parsed JavaScript value serialized again — not a whitespace-only rewrite of the original string.

{
  "name": "John Doe",
  "age": 30,
  "email": "john@example.com",
  "address": {
    "street": "123 Main St",
    "city": "New York",
    "country": "USA"
  },
  "hobbies": [
    "reading",
    "coding",
    "gaming"
  ]
}

JSON Formatting Options

Prettify / Beautify

Adds indentation and line breaks so humans can read the tree. Docify always uses 2 spaces via JSON.stringify(value, null, 2). There is no 4-space or tab option on this page.

Minify / Compress

Serializes the same parsed value to a single compact line (JSON.stringify with no space argument). Non-ASCII letters stay characters — see minify without breaking unicode. Useful when you want a smaller copy to paste back into a payload.

Validate

Runs the same JSON.parse step. On success you get a Valid JSON badge and the 2-space serialization. On failure the badge shows the browser’s parser message. The tool does not highlight a line gutter or re-check as you type. A complete exponent such as 1e309 parses as Infinity and that serialization is null; 1e308 stays a number.

A complete exponent such as 1e309 becomes null

Prettify is parse then stringify, not a whitespace-only rewrite. RFC 8259 §6 allows range limits and names 1E400 as a number that may not interoperate. JSON.parse("1e309") is Infinity; JSON.stringify then writes null, so {"n":1e309} becomes {"n":null}. 1e308 stays finite. 1e-324 underflows to 0. Write {"n":"1e309"} if the magnitude must survive. The Infinity token still fails parse.

Common JSON Errors & How to Fix Them

Trailing commas

JSON does not allow commas after the last item in arrays or objects.

Invalid:

{"name": "John",}

Valid:

{"name": "John"}

Single quotes

JSON requires double quotes for strings, not single quotes.

Invalid:

{'name': 'John'}

Valid:

{"name": "John"}

Missing commas

Items in arrays and object properties must be separated by commas.

Invalid:

{"name": "John" "age": 30}

Valid:

{"name": "John", "age": 30}

Format JSON in the browser

Load sample Prettify is John Doe / age 30 / hobbies 2-space JSON. Load sample does not run Prettify. Standard JSON only. Nothing is uploaded.

Use JSON Formatter →

FAQ

What does Load sample Prettify write on the live JSON page?
Load sample fills the compact object {"name":"John Doe","age":30,"email":"john@example.com","address":{"street":"123 Main St","city":"New York","country":"USA"},"hobbies":["reading","coding","gaming"]} and does not run Prettify, Minify, or Validate. Prettify then writes the matching 2-space JSON. age is the number 30. Minify writes that same compact line. Validate writes that same 2-space JSON and the Valid JSON badge — the same JSON.parse then JSON.stringify(value, null, 2) path as Prettify. This is not the older users / Jane Smith / total leftover. Standard JSON only — no comments, trailing commas, or JSON5.
Does Docify upload JSON I paste into the formatter?
No. The live formatter runs JSON.parse and JSON.stringify in your browser. Load sample, Prettify, Minify, and Validate stay on the page. The page does not send the text to a server.
What is the difference between JSON and a JavaScript object literal?
JSON (ECMA-404 / RFC 8259) requires double-quoted keys and strings, and it does not allow trailing commas, comments, functions, or undefined. A JavaScript object literal can use all of those, so it is not interchangeable with JSON.
What does Docify’s Prettify button actually do?
It parses the input with JSON.parse, then serializes it with JSON.stringify using 2-space indentation. Load sample fills the compact John Doe object and does not run Prettify. Prettify of that leftover writes the matching 2-space JSON; age stays the number 30. Minify uses the same parse and serializes to one compact line. Validate is that same parse-then-stringify path (2-space) and shows the browser parser error if the text is invalid. A complete exponent such as 1e309 parses as Infinity and then stringifies as null; 1e308 stays finite.
Why does JSON 1e309 become null after Prettify?
JSON.parse uses IEEE-754 binary64. Number.MAX_VALUE is 1.7976931348623157e+308. JSON.parse("1e309") is Infinity; JSON.stringify then writes null, so {"n":1e309} becomes {"n":null}. Validate still reports valid. 1e308 stays 1e+308. 1e-324 underflows to 0. The Infinity token still fails parse. Keep magnitudes that must survive as JSON strings. Nothing is uploaded.
Can I format JavaScript object literals or JSON5?
No. Unquoted keys, single quotes, trailing commas, and comments are rejected by JSON.parse. Convert the text to strict JSON first.

Related

← Back to all articles | Explore all tools →