Indent:
Input 0 B
Ready
Ln 1, Col 1 0 chars
Output 0 B
Formatted JSON will appear here...
0 chars 0 nodes
Features

Why developers love this formatter

⚡ Live formatting

As you type, JSONLab parses and reformats your input instantly. No need to click a button — see the result update in real time with sub-100ms response even on large documents.

🎯 Precise error reporting

When JSON is invalid, you get the exact line, column, and a visual pointer to the problem character. No more guessing where the missing comma went.

🎨 Syntax highlighting

Output is color-coded by token type: keys, strings, numbers, booleans, and null all get distinct colors, making complex JSON instantly scannable.

⚙️ Flexible indentation

Choose between 2 spaces, 4 spaces, tabs, or any custom indent string. Optionally sort object keys alphabetically for consistent diffs and easier scanning.

💾 Local persistence

Your input is saved to localStorage automatically. Close the tab, come back tomorrow, and your work is still there. No accounts, no sync, no surveillance.

📤 One-click share

Generate a shareable URL containing your JSON (compressed with gzip). Send it to a colleague and they'll see exactly what you see — without any server in the middle.

Examples

See it in action

API Response

{
  "users": [
    {"id":1,"name":"Ada","role":"admin"},
    {"id":2,"name":"Grace","role":"user"}
  ],
  "total": 2,
  "page": 1
}

Configuration File

{
  "server": {
    "port": 8080,
    "host": "0.0.0.0",
    "tls": false
  },
  "logging": {"level": "info"}
}
How it works

Under the hood

1. Native parser

We use the browser's built-in JSON.parse which is implemented in C++ and orders of magnitude faster than any JavaScript parser. For huge files, parsing happens in a Web Worker to keep the UI responsive.

2. Custom serializer

Instead of relying on JSON.stringify alone, JSONLab uses a custom serializer that respects your indentation choice, sorts keys when asked, and produces deterministic output for cleaner version control diffs.

3. Token highlighter

The output is tokenized into keys, strings, numbers, booleans, null, and punctuation. Each token type is wrapped in a span with a CSS class, letting the theme system control colors without re-parsing.

FAQ

Formatting JSON — common questions

How do I format JSON online?

Paste your JSON into the input box at the top of this page. With "Live format" enabled (the default), the formatted output appears instantly in the right pane. If live formatting is disabled, click the Format button to trigger formatting manually.

You can then copy the result to your clipboard with the copy icon, download it as a .json file, or generate a shareable URL that encodes your JSON directly in the link.

What's the difference between JSON formatting and minification?

Formatting (also called beautifying or pretty-printing) adds whitespace — line breaks and indentation — to make JSON readable by humans. Minification does the opposite: it removes all unnecessary whitespace to produce the smallest possible valid JSON, suitable for transmission over the network.

Use formatting during development and debugging. Use minification in production for API responses and config files where byte size matters. JSONLab has dedicated tools for both: this formatter and the JSON Minifier.

What indentation should I use?

The most common convention is 2 spaces, used by default in most JavaScript projects, npm packages, and modern style guides (Airbnb, Standard, Prettier). 4 spaces is traditional in Python, Java, and older JavaScript codebases. Tabs are technically superior (accessibility, configurability) but cause friction in teams mixed on the topic.

For new projects, use 2 spaces unless your team has a specific reason otherwise. For consistency with existing code, match what's already there — JSONLab's auto-detect feature helps identify the existing style.

Why sort object keys?

Sorting keys alphabetically produces deterministic output: the same JSON value always serializes to the same string. This is invaluable for:

Cleaner git diffs — reordering keys no longer creates noise in version control
Hashing and caching — sorted JSON can be safely used as a cache key
Easier scanning — finding a specific key in a long object is faster when keys are alphabetical

However, sorting changes the original intent in some cases (e.g., when key order carries meaning). Use it deliberately, not by default.

Can JSONLab handle huge files?

Yes. JSONLab uses Web Workers to offload parsing and serialization to background threads, so even multi-megabyte files won't freeze your browser. The formatter has been tested with files up to 50MB on a mid-range laptop — formatting completes in under 2 seconds.

For extremely large files, consider disabling "Live format" so the formatter only runs when you explicitly click Format. This prevents re-parsing on every keystroke.

Is my JSON sent to a server?

No. JSONLab is 100% client-side. Your JSON never leaves your browser — there's no server to receive it. You can verify this in your browser's DevTools Network tab: the only requests you'll see are for the initial page load (HTML, CSS, JS, fonts) and nothing else. Even the share feature encodes your data into the URL itself, never transmitting it.