JSONata Playground

A quick way to test JSONata expressions against JSON data in VS Code. Write queries on the left, see results on the right.

How it works

• Three-panel editor: JSON input (left), JSONata expression (middle), output (right)
• Live evaluation: Updates as you type
• Load/save files: Open .json or .jsonata files, save results
• Theme adaptive: Automatically matches your VS Code theme (Monokai, Dracula, One Dark Pro, etc.)

Quick start

1. Open the Command Palette (Ctrl+Shift+P)
2. Run "Open JSONata Playground"
3. Paste your JSON on the left
4. Write a query in the middle
5. View results instantly on the right

Example

JSON Input:

{
  "name": "John",
  "age": 30,
  "email": "john@example.com"
}

JSONata Expression:

$[name, age]

Output:

[
  "John",
  30
]

Panel Controls

Available for:

• JSON Panel: Load/save .json files
• JSONata Panel: Load/save .jsonata or .txt files
• Output Panel: Save results as .json or .txt

Requirements

• VS Code 1.110.0 or higher

Learn more

• JSONata docs
• JSONata on GitHub