CodeKitHubHow to Use
- Paste your JSON into the input box on the left (or click "Load Example" to try it).
- Choose 2-space or 4-space indentation.
- Click "Format" to beautify, or "Minify" to compress it to a single line.
- If the JSON is invalid, read the error message below the boxes to find the problem.
- Click "Copy" to copy the result to your clipboard.
Example
Input
{"name":"CodeKitHub","tools":["json","base64"],"free":true}Output
{
"name": "CodeKitHub",
"tools": [
"json",
"base64"
],
"free": true
}The same data, formatted with 2-space indentation. Minify does the reverse: it removes all whitespace.
What Is This Tool?
A JSON formatter takes raw, minified or messy JSON text and rewrites it with consistent indentation and line breaks so it becomes easy to read. JSON (JavaScript Object Notation) is the most common data format used by APIs, configuration files and log systems, but servers usually send it as one long unreadable line to save bandwidth.
This tool also works as a JSON validator: it parses your input using the same strict rules browsers use, so if your JSON has a missing comma, an unquoted key or a trailing comma, you will see the exact error message instead of a silent failure.
JSON is formally defined by two aligned standards, RFC 8259 and ECMA-404 — and the spec is deliberately stricter than JavaScript itself, which is why a snippet that runs fine as JS code can still fail strict JSON validation here.
Practical tips
- Debugging an API? Paste the raw response first, format second — the validator pinpoints the exact line and column of any syntax problem, which beats squinting at a one-line blob.
- Use 2-space indent for reading on screen and minify before pasting JSON into a URL, an environment variable or a chat message — whitespace only costs bytes there.
- JSON5-style comments and trailing commas are the two most common reasons hand-written config "looks fine" but fails validation: strict JSON allows neither.
- For very large files (logs, database dumps), format only the fragment you care about — your editor stays responsive and the structure is easier to follow.
Where this fits in real workflows
The most common flow we see: an API returns Base64-wrapped or minified JSON inside a token or webhook payload. Decode the Base64 first, format the JSON second, and diff two responses third when something changed between environments. Each step has a dedicated tool here, and your payloads never leave the browser at any of them.
Frontend developers use the minify direction just as often as formatting: shipping a large static JSON file? Minifying it typically saves 20–30% before gzip even starts.
Common JSON errors and how to fix them
Most "invalid JSON" reports trace back to a small set of repeat offenders. The table below covers the ones that show up most often when hand-editing config files or debugging copy-pasted API output.
| Error | Example | Fix |
|---|---|---|
| Trailing comma | {"a": 1, "b": 2,} | Remove the comma after the last item in an object or array. |
| Single quotes | {'a': 1} | JSON requires double quotes for keys and string values. |
| Unquoted key | {a: 1} | Wrap every object key in double quotes: {"a": 1}. |
| Comments | { // note\n "a": 1 } | Strict JSON has no comment syntax — delete // and /* */ comments before validating. |
| Missing comma | {"a": 1 "b": 2} | Insert a comma between each key-value pair. |
| NaN / undefined / Infinity | {"a": NaN} | These are valid JavaScript but not valid JSON — use null or a string instead. |
Common use cases
- Reading a minified API response returned as one unreadable line, to understand its structure during debugging.
- Validating a config file (like a package.json or a JSON-based settings file) that mysteriously isn't being read correctly by an application.
- Sharing a readable, formatted snippet of JSON in a bug report, code review, or documentation.
- Shrinking a JSON payload to its smallest form before embedding it in a URL parameter or storing it in a database column with size limits.
Why Use It?
An API just handed you a 400-error response as one unreadable line — paste it here to see which field actually failed instead of scrolling a wall of text.
Your build is failing with "Unexpected token in JSON at position 214" and no other clue — paste the file and the error message shows you the exact line and column.
You're about to embed a config object in a script tag or send it over a slow API — minify it first and shave the whitespace before it ever leaves your machine.
The JSON you're debugging contains customer records or API keys — everything runs locally, so nothing gets uploaded to a third-party server just to be read.
You're reviewing a teammate's pull request with a raw minified JSON fixture — format it here first so the diff actually means something.
No sign-up wall between you and the tool — open it on your phone during an on-call incident and it works exactly the same.
Frequently Asked Questions
Is my JSON data uploaded to a server?
No. This tool runs entirely in your browser using JavaScript. Your JSON never leaves your device, which makes it safe to use with sensitive or internal data.
Why is my JSON invalid?
The most common causes are: missing or extra commas, keys without double quotes, single quotes instead of double quotes, trailing commas after the last item, and comments (JSON does not allow comments). The error message under the input box tells you what the parser found.
What is the difference between Format and Minify?
Format adds indentation and line breaks to make JSON human-readable. Minify removes all unnecessary whitespace to make the JSON as small as possible — useful before transmitting or embedding it.
Is there a size limit?
There is no hard limit imposed by the tool. Very large files (tens of megabytes) may be slow depending on your device, because all processing happens locally in your browser.
Can this fix broken JSON automatically?
No — the tool tells you exactly where the JSON is broken so you can fix it, but it does not guess or change your data. This is intentional: silently "fixing" data can hide real bugs.
Does this support JSON5 or JSONC (comments, trailing commas, unquoted keys)?
No, and that's deliberate — this tool validates against strict RFC 8259 JSON, the format your APIs and JSON.parse() actually require. If you need to format a JSONC config file (like tsconfig.json or VS Code settings), strip the comments first or the parser will report them as errors.
How is this different from just running JSON.stringify in the browser console?
JSON.stringify(JSON.parse(x), null, 2) does the same reformatting, but you need a console open and it throws an unhelpful generic error on invalid input instead of pointing at the failing line and column the way this tool does.
Does it work with really deeply nested JSON, like GraphQL responses?
Yes — there's no artificial nesting-depth limit, only the practical limit of your browser's memory and how far you want to scroll. Deeply nested structures are exactly where formatting helps most, since a one-line version is nearly unreadable past 3-4 levels.
Does it work offline or in a browser without an internet connection?
Yes. Once the page has loaded, all parsing and formatting logic runs locally in JavaScript — you can disconnect from the network and keep formatting JSON.