Code Mode
Tree Mode
Instructions
Code Mode
- Edit JSON code directly
- Syntax highlighting and auto-complete
- Automatic syntax error detection
- Use the toolbar for quick actions
Tree Mode
- Visually view and edit JSON structure
- Add, delete, rename nodes
- Expand/collapse nodes for details
- Use the toolbar for quick actions
Tips
The two editors operate independently. Click "Sync to Tree" or "Sync to Code" to sync content. The toolbar provides shortcuts for formatting, compressing, sorting, and fixing.
JSON Editor
JSON Editor is a free visual online editor with synchronized code and tree views. In tree mode you can add, edit, delete, and drag-and-drop nodes directly — no manual brackets or quotes — which greatly reduces errors when editing complex JSON.
Editing happens entirely in your browser with no data uploaded and no registration required. Great for config files, API debugging, and restructuring deeply nested data.
How to Use
- Paste or type JSON, or upload a JSON file
- Switch freely between code mode and tree mode
- In tree mode, click nodes to edit values or drag to restructure
- Copy the result or export it as a file
FAQ
Is the JSON Editor free?
Completely free — all features are available without an account.
What is the difference between tree mode and code mode?
Code mode is plain-text editing; tree mode shows JSON as an expandable node tree you can click to edit. Both stay in sync in real time.
Is my data uploaded to a server?
No. Editing is fully local to your browser; data disappears when you close the page.
Can it handle large files?
Yes, JSON files of several megabytes — typical configs and API payloads — edit smoothly.