JSON Formatter

JSON Formatter takes text from a textarea, parses it with the browser’s JSON.parse, and if that succeeds, writes pretty-printed JSON with JSON.stringify. The page opens with the sample {"hello":"world"}. It reports Valid JSON or Invalid JSON in ToolResultSummary and shows a character count of the current input.

There is no Format button. On each input or indent change, a useMemo runs JSON.parse(deferredInput) then JSON.stringify(obj, null, Number(indent)). deferredInput comes from useDeferredValue, so while React is catching up the UI can show “Formatting…” and hide the previous error. Over-limit checks on the visible counter use the live input length immediately.

1. Paste or edit text in Input JSON.
2. Watch the character counter under the textarea.
3. If Formatting… appears, wait until it clears.
4. Choose Indent 2, 4, or 8 if you need a different indent.
5. If parse succeeds, Formatted Output shows the stringify result in a <pre> with status Valid JSON.
6. If parse fails, Formatted Output shows an em dash (—) and Invalid JSON: plus the parser message appears under the input.

This page uses JSON.parse, not eval and not a JavaScript parser. Text that a JS engine might accept as an object literal can still fail here.

• Keys and strings must use double quotes.
• Trailing commas in objects or arrays fail.
• // and /* */ comments fail.
• Unquoted keys fail.
• Invalid escapes and unescaped line breaks inside strings fail.
• Mismatched [ ] or { } fail.
• Empty input is not valid JSON; JSON.parse("") throws.

JSON.parse can succeed for values that are not objects, such as arrays, strings, numbers, true, false, or null. Those values are then pretty-printed with the same stringify call. The tool does not repair invalid text into valid JSON.

Indent control

A <select> with values 2, 4, and 8. Default state is 2.

Serializer

JSON.stringify(parsedValue, null, Number(indent)). The replacer is null, so keys are not sorted by this tool.

Whitespace

Pretty-print spaces only. There is no tab option and no minify (space omitted) option.

Changing indent re-serializes the already-parsed value. Property order follows what JSON.parse produced and what JSON.stringify emits; there is no sort-keys control.

Ceiling

MAX_JSON_INPUT_LENGTH is 1,000,000 characters. The counter shows live length / 1,000,000.

Size error

Above the ceiling, JSON.parse is skipped. Status is “Input too large”. The output <pre> shows “Input exceeds the supported processing limit.” Under the textarea, a role=alert reads “JSON input is too large to process safely. Use 1,000,000 characters or fewer.” That “safely” wording is the UI string, not a security guarantee.

Syntax error

Prefixed “Invalid JSON: ” plus error.message, or “Invalid JSON syntax.” if message is missing. Status “Invalid JSON”. Size alerts and syntax messages are separate; syntax text is cleared while “Formatting…” is showing.

Success

Status “Valid JSON” and the pretty-printed string in the output <pre>.

• No minify control (JSON.stringify is always called with 2, 4, or 8 as the space argument).
• No object-key sorting.
• No copy or download buttons (you can still select text in the output <pre>).
• No file import; input is the textarea only.
• No schema validation, API request, or JSON Schema checker.
• No automatic syntax repair or “fix JSON” rewrite.
• No dedicated line/column highlighter beyond whatever JSON.parse puts in error.message.

JsonFormatter.jsx parses and stringifies in the browser. It does not call trackToolEvent and does not POST the textarea to a formatter API. That is not a confidentiality guarantee: the rest of the page can still load site assets; the privacy policy describes first-party analytics for event metadata (not designed to store tool contents); browser extensions, shared devices, and clipboard use remain outside this component.

Do not treat the page as a vault for secrets. Local JSON.parse does not encrypt or isolate the text from the browser environment.

• JWT Decoder — when the input is a three-segment token, not a JSON document. It Base64URL-decodes header and payload JSON and does not verify signatures.
• Text Diff — when you need to compare two texts line by line (it includes a JSON example, but compareLines is string equality per line, not a structural JSON diff).
• Base64 Encoder/Decoder — when the JSON is wrapped as Base64 text. Base64 is encoding, not encryption.
• SQL Formatter — formats SQL patterns; it does not parse JSON.
• Code Minifier — minifies JavaScript, CSS, or HTML. It is not a JSON minifier and this formatter has no minify mode.

• Confirm status is Valid JSON before copying from the <pre>.
• If Invalid JSON, read the parser message; fix quotes, commas, and brackets in the source—this page will not rewrite them.
• Check the indent (2/4/8) matches what you need to paste elsewhere.
• If the character count is at the ceiling, shorten the payload; the size error is not a syntax diagnosis.
• Keep a copy of the original text; there is no download control.