JSON Formatter

What Is the JSON Formatter?

It takes compact or messy JSON and re-indents it so nested objects and arrays are easy to read. Everything happens in your browser, so API responses and config files never leave your device.

When to Use It

• To read an API response or log entry.
• To tidy configuration files before committing them.

How to Use It

1. Paste your JSON.
2. Format it and copy the result.

Understanding the Result

Formatting only adds whitespace; keys and values are unchanged. If the JSON is invalid, you get an error instead - check it with the JSON Validator.

Limitations

JSON does not allow comments or trailing commas. To make JSON smaller again use the JSON Minifier.

Example

A compact API response such as:

{"id":1042,"customer":{"name":"Asha","email":"asha@example.com"},"items":[{"sku":"A-100","qty":2}],"paid":true}

becomes:

{
  "id": 1042,
  "customer": {
    "name": "Asha",
    "email": "asha@example.com"
  },
  "items": [
    {
      "sku": "A-100",
      "qty": 2
    }
  ],
  "paid": true
}

Where JSON Comes From

• The Network tab in browser dev tools - copy a response and paste it here.
• API tools and curl output, which is usually on one line.
• Log files and database columns that store JSON.
• Configuration files such as package.json, composer.json and tsconfig.json.

Tips

• If formatting fails, the JSON is invalid - the most common causes are trailing commas and single quotes. Our guide to formatting and validating JSON covers every common error.
• Looking for one value in a big response? Use the JSONPath Tester.
• Need types for your code? JSON to TypeScript generates interfaces from the same data.

See also the best free JSON tools and when to use each.