YAML Tree Viewer
Parse YAML into an interactive collapsible tree. Supports multi-document YAML, anchors & aliases, search, JSON conversion, and drag & drop .yaml/.yml files.
What is a YAML tree viewer?
A YAML tree viewer parses YAML text and renders it as an interactive, collapsible tree structure. Each node shows its key, type, and value, letting you visually explore nested YAML without reading raw text.
How does this tool handle multi-document YAML files?
YAML files can contain multiple documents separated by "---". This tool parses each document independently and renders each one as a separate tree, labeled "Document 1", "Document 2", and so on.
Does it support YAML anchors (&) and aliases (*)?
Yes. Anchors defined with &anchor and references with *alias are resolved automatically by the js-yaml parser. The expanded content is shown inline in the tree, so you can see the actual value an alias points to.
How do I convert YAML to JSON?
Click the "To JSON" button in the toolbar. The tool parses your YAML and outputs formatted JSON with 2-space indentation. You can then copy the JSON result to your clipboard with one click.
What happens when YAML has a syntax error?
The tool displays a clear error message below the input area, including the line number and a description of the problem (e.g., "bad indentation of a mapping entry at line 5"). The tree view stays empty until you fix the syntax.
How does the search feature work?
Type a keyword into the search box and matching keys and string values are highlighted instantly. Use the prev/next buttons or Enter (forward) and Shift+Enter (backward) to jump between matches.
Can I load YAML from a file?
Yes. Click the "Load File" button to browse for a .yaml or .yml file, or drag and drop a file onto the input area. File contents are read locally in your browser and never uploaded to a server.
How are different value types displayed?
Each type has a distinct color: strings are green, numbers are blue, booleans are orange, and null values are gray. Objects show a {count} badge and arrays show a [count] badge indicating the number of children.
Is my YAML data sent to a server?
No. All parsing, rendering, searching, and JSON conversion happen entirely in your browser. Your YAML data never leaves your device, making this tool safe for sensitive configuration files.
Does this tool work offline?
Once the page is loaded, the tool runs entirely in your browser and can work without an internet connection. Only the initial page load requires network access to fetch the static assets and the js-yaml library.