🌳 JSON Viewer & Tree Explorer

Explore and navigate JSON data with an interactive tree view. Expand/collapse nodes, search keys and values, copy paths, and validate structure instantly. Free JSON tree viewer.

JSON Input

Tree View

How to Use

Paste your JSON

Paste any valid JSON — objects, arrays, or nested structures — into the input area on the left. Press Ctrl+Enter or click Parse.

Explore the tree

Click the ▾ toggle arrows to collapse or expand any node. Use Expand All / Collapse All to control the entire tree at once.

Search and copy paths

Type in the search box to filter keys and values in real time. Hover any key and click ⎘ to copy its full dot-notation path.

Frequently Asked Questions

What is a JSON tree viewer? +

A JSON tree viewer renders JSON data as a collapsible hierarchy of nodes, making it easy to navigate objects and arrays without reading raw text. You can expand only the parts you need and search across the entire structure.

How do I copy a key path? +

Hover over any key and click the ⎘ (copy path) icon that appears. The full dot-notation path — like user.address.city — is copied to your clipboard.

Can I search inside the JSON? +

Yes. The search bar at the top filters all keys and values in real time. Non-matching rows are hidden, and all parent nodes stay expanded so matches remain visible.

Is my JSON sent to a server? +

No. Everything runs in your browser. Your JSON data never leaves your device.

Guía: Visor de Árbol JSON

¿Qué es?

Representa la estructura jerárquica del JSON con nodos expandibles/colapsables. A diferencia del formateador, permite navegar estructuras profundamente anidadas, buscar claves y valores, y copiar rutas de acceso como data.users[0].email.

Cómo usar

Pega tu JSON y haz clic en Parse.
Navega el árbol haciendo clic en los nodos.
Busca claves o valores con el campo de búsqueda.
Copia rutas haciendo clic en ⎘ junto a cualquier clave.

Consejos

"Expandir todo" es útil para obtener una vista global de la estructura.
Colores por tipo: strings (verde), números (naranja), booleanos (cian), nulos (rojo).
Copia la ruta de acceso para usarla directamente en tu código.