JSON Editor

• Visual tree builder: Work with objects and arrays as readable nested rows instead of raw punctuation.
• Inline editing: Change object keys and string, number, or boolean values while null stays an explicit JSON value.
• Structure controls: Add properties or items, duplicate a node, delete it, and move siblings up or down.
• Safe commits: Invalid numbers and duplicate keys are rejected without replacing the last valid document.
• History: Undo and redo imports, edits, type changes, and structure changes for the current tab session.
• Local export: Copy the read-only generated JSON or download it as edited.json.

1. Start with an empty document or import JSON

   The editor starts with an empty object. Open Import JSON, paste strict JSON, upload a file, or drop one onto the import area, then choose Import JSON.

2. Edit the visual tree

   Edit an object key or primitive value inline. Press Enter or click away to commit a change; press Escape to restore the previous value.

3. Add and organize nodes

   Use Add property or Add item, then use the duplicate, delete, and move controls on each child row. Expand all or collapse all to manage nested documents.

4. Choose preview formatting

   Select 2 spaces, 4 spaces, tabs, or Minified from the Preview menu. The generated JSON preview updates after each committed tree change.

5. Copy or download the result

   Use Copy for the clipboard or Download for an edited.json file. Undo and redo remain available for the current editing session.

Example JSON:

{
  "service": "billing",
  "retry": {
    "enabled": true,
    "attempts": 3
  },
  "regions": ["ca-central-1", "us-east-1"]
}

• Input and editing are limited to 5 MiB, 10,000 value nodes, and 100 levels of nesting.
• Only strict JSON is accepted; JSON5, JSONC, comments, trailing commas, and unquoted keys are not supported.
• JSON numbers use browser JavaScript precision; integer literals outside the safe range may be rounded, and duplicate import keys follow JSON.parse with the last value retained. Use strings for exact large identifiers.
• The generated preview is read-only in version 1; edit the visual tree to change output.
• Search/filtering, JSON Schema validation, share links, local persistence, and tree reparenting are not part of this release.
• Clipboard access depends on browser permissions; the shared fallback is used when available.

Import, editing, serialization, clipboard preparation, and download generation happen in the browser tab. The tool does not upload JSON, include JSON content in analytics, or persist the document after the tab is closed.

• Modern browsers: Chrome, Firefox, Safari, and Edge.
• Requirements: JavaScript enabled, with file and clipboard permissions available for those actions.
• Mobile: Responsive controls and a scrollable tree support touch-sized screens.

What is a JSON Editor?

A JSON Editor is a visual tool for building and changing JSON objects and arrays without hand-editing every bracket, quote, or comma. This editor shows the document as a tree and generates valid JSON from the current values.

Can I import an existing JSON file?

Yes. Paste strict JSON into the Import JSON panel, choose Upload JSON, or drop a JSON file onto the import area. A successful import replaces the current tree; an invalid import leaves the current document unchanged and reports the detected line and column.

Can I edit JSON arrays and objects visually?

Yes. Add properties to objects and items to arrays, edit keys and primitive values inline, duplicate or delete nodes, and move siblings up or down. The root can be changed between all supported JSON types.

Does this JSON Editor validate the output?

The editor only commits valid JSON value types and rejects invalid numbers and duplicate object keys. Its read-only preview is serialized from the tree, so it shows the document that will be copied or downloaded. Because browser JavaScript follows JSON.parse number semantics, very large integer literals can be rounded and duplicate import keys keep the last occurrence; use strings for exact large identifiers.

Is my JSON sent to a server?

No. The editor parses, changes, serializes, copies, and downloads JSON locally in your browser. JSON content is not added to analytics, saved by this tool, or transmitted to a server.

Can I undo and redo JSON Editor changes?

Yes. Imports, edits, type changes, add/delete/duplicate/reorder operations, sample loading, and clearing are undoable. The editor keeps up to 100 committed history steps and starts a new history branch after a new edit.

How do I export the JSON I built?

Choose Copy to put the generated JSON on the clipboard, or choose Download to save it as edited.json with the application/json MIME type. Select 2 spaces, 4 spaces, tabs, or minified output before exporting.

What are the JSON Editor size limits?

Imports are limited to 5 MiB, 10,000 value nodes, and a maximum nesting depth of 100. These limits keep a client-side visual editor responsive and prevent unexpectedly large browser workloads.

Does the editor support JSON5, JSONC, or comments?

No. Version 1 accepts strict JSON through JSON.parse, so comments, trailing commas, single-quoted strings, and unquoted keys are rejected. Convert JSON5 or JSONC to strict JSON before importing it.

What happens when I change a container type?

Changing a non-empty object or array to another type removes its child nodes, so the editor asks for confirmation first. Primitive conversions use a safe value for the selected type, and Escape restores an unfinished inline edit.