JSON ↔ YAML Converter — Convert Between JSON and YAML Online _

What is JSON ↔ YAML conversion?

JSON (JavaScript Object Notation, RFC 8259) is a strict, brace-delimited text format for structured data; YAML (YAML Ain't Markup Language, version 1.2) is a superset of JSON that uses indentation, line breaks, and human-readable syntax for the same value model. Converting between them lets you pivot the same configuration between a machine-friendly form (JSON for APIs, schema validation, programmatic transforms) and a human-friendly form (YAML for code review, Kubernetes manifests, GitHub Actions workflows) without retyping a single key.

How does JSON ↔ YAML conversion work?

Every conversion runs locally in your browser using the bundled js-yaml library (MIT, version 4.1.0). The high-level steps are:

1. The mode selector (Auto-detect / JSON → YAML / YAML → JSON) decides which pipeline runs. In Auto-detect mode the first non-whitespace character of the input picks the direction — { or [ means JSON; anything else means YAML.
2. JSON → YAML: JSON.parse validates the input and produces a JavaScript value; jsyaml.dump(value, { indent, lineWidth: -1, sortKeys: false }) writes the YAML 1.2 form. With Multi-document on, an input array is dumped one element per document and joined with --- separators.
3. YAML → JSON: jsyaml.loadAll parses every document in the input (handling --- separators automatically) into an array; single-document inputs are unwrapped so the JSON output is the document itself, not a one-element array.
4. Indent (2 or 4 spaces) and Pretty-print are configurable. Pretty-print off emits minified JSON via JSON.stringify(value) with no whitespace.
5. Output is written to the read-only textarea. On YAML parse failures, the error message includes the 1-indexed line and column reported by js-yaml's e.mark so you can jump straight to the bug.

Why convert JSON and YAML with this tool?

• Privacy: every parse, transform, and emit pass happens in your browser. The data — including Kubernetes secrets, signed JWTs, and proprietary configs — never reaches our servers.
• Multi-document YAML: jsyaml.loadAll recognises --- separators and returns an array of documents, which the converter unwraps for single-doc cases or preserves as a JSON array for multi-doc cases.
• Anchors and aliases resolved: YAML's &anchor / *alias mechanism is handled by js-yaml's default schema. A value defined once and referenced twice round-trips to a JSON object where all references hold equal values.
• No CDN, no telemetry: the js-yaml.min.js library is shipped from the same origin as the page, so the tool works offline, behind corporate proxies, and inside air-gapped environments.

What are common applications of JSON ↔ YAML conversion?

Pivoting between JSON and YAML shows up across DevOps, platform engineering, and API tooling:

• Kubernetes manifests: converting a YAML Deployment, ConfigMap, or HelmRelease to JSON so an in-house policy validator (Joi, Ajv, OPA Rego) can lint it programmatically, then back to YAML for the cluster apply.
• CI/CD workflows: round-tripping a GitHub Actions workflow.yml through JSON so a code-generator can rewrite the matrix or job dependencies, then emitting the cleaned-up YAML for the PR.
• OpenAPI specs: pasting a JSON openapi.json from a backend's auto-generated docs and converting to openapi.yaml for the human-edited reference checked into the repo.

What does a JSON ↔ YAML round-trip example look like?

Pasting {"apiVersion":"apps/v1","kind":"Deployment","metadata":{"name":"web"},"spec":{"replicas":3,"selector":{"matchLabels":{"app":"web"}}}} and pressing CONVERT in JSON → YAML mode produces eight lines of indented YAML with apiVersion: apps/v1 on the first line. Feeding that YAML back in YAML → JSON mode with Pretty-print on returns the original object byte-for-byte after a stable JSON.stringify(value, null, 2), with key order preserved because js-yaml's default schema honours insertion order on both directions.

Does this JSON ↔ YAML converter run entirely in my browser?

Yes. Every parse, transform, and emit pass runs locally as JavaScript inside your browser tab. The bundled js-yaml library ships from the same origin as the page — no CDN, no fetch, no XMLHttpRequest, no navigator.sendBeacon on the input. The tool also works offline once the page has loaded, because it is a static HTML/CSS/JS bundle with the vendor library copied alongside it. Kubernetes secrets, JWT payloads, signed CloudFormation YAMLs, and proprietary configs stay on your device.

How does the converter handle multi-document YAML?

YAML supports multiple documents in one stream separated by lines containing only ---. On YAML → JSON the converter calls jsyaml.loadAll, which returns every document as a JavaScript value. If exactly one document is found the JSON output is that document directly; if two or more are found the JSON output is an array. On JSON → YAML, when the input is a JSON array AND the Multi-document toggle is on, each array element is emitted as its own document with --- separators between them — useful for generating a kubectl apply-friendly bundle from a JSON array of resources.

Are YAML anchors and aliases supported?

Yes — &anchor definitions and *alias references are resolved by js-yaml's default schema during the load step. A YAML input like defaults: &d\n retries: 3\n timeout: 30\njob_a:\n <<: *d\njob_b:\n <<: *d parses to a JSON object where job_a and job_b both contain retries: 3, timeout: 30. The merge key << (a YAML 1.1 extension that js-yaml still honours) is also supported on the default schema.

Are YAML comments preserved when converting to JSON and back?

No — js-yaml strips comments during the parse step, so a YAML → JSON → YAML round-trip will lose every #-prefixed line. This is a known limitation of the load/dump model; if comment preservation is critical, use a comment-aware library like the yaml npm package (which ships a CST + AST API designed to preserve trivia) rather than js-yaml. For most config-conversion workflows the trade-off is acceptable: the round-tripped YAML keeps every key, value, anchor, and alias, just without the human-authored comments.

What happens to custom YAML tags?

The converter uses js-yaml's DEFAULT_SCHEMA, which understands !!str, !!int, !!float, !!bool, !!null, !!seq, !!map, !!binary, and !!timestamp — every tag in the YAML 1.2 core and JSON schemas. Custom or application-specific tags (e.g. !Ref in CloudFormation, !vault in Ansible) are not recognised and surface as a clear error citing the unsupported tag. For CloudFormation specifically, use the aws cloudformation package + --output-template-file flow to expand custom tags before pasting into this converter.

This JSON ↔ YAML converter ships with js-yaml@4.1.0 bundled at the same origin, supports multi-document streams and anchors/aliases out of the box, and reports YAML parse errors with line and column so you can fix the source. No upload, no CDN, no telemetry — every byte stays in your browser.