Beautify JSON - JSON Formatter

Convert inline/unreadable JSON into well-formatted code

Tags: beautify code json

🚀 181,062 total conversions (338 this month)

Practice Python with coding challenges

Solve hands-on problems right in this editor: run the sample tests, submit, and get an AI code review.

All Python challenges
Easy

Average of Three

Average three whole numbers.

BeginnerLearning-pathVariables
Easy

Rectangle Perimeter

Compute the perimeter of a rectangle from its sides.

BeginnerLearning-pathVariables
Hard

Course Schedule Order

Order courses so every prerequisite comes first.

AdvancedGraphsHackathonTopological-sort
No solutions yet
Medium

Island Perimeter

Measure the coastline of land cells in a grid.

AdvancedGridsHackathon
No solutions yet
Medium

K-th Smallest Element

Find the k-th smallest value without fully sorting.

AdvancedCompetitive-programmingSorting
No solutions yet
Hard

Median of Two Sorted Arrays

Find the median of two sorted lists combined.

AdvancedBinary-searchCompetitive-programming
No solutions yet
Medium

Game of Life Step

Advance Conway's Game of Life by one generation.

AdvancedGridsHackathonSimulation
No solutions yet
Hard

Shortest Delivery Tour

Visit every city once and return home as cheaply as possible.

AdvancedBitmasksCompetitive-programmingDynamic-programming
No solutions yet
Hard

Strongly Connected Components

Count groups of nodes that can all reach each other.

AdvancedCompetitive-programmingGraphs
No solutions yet
Hard

Longest Path in a DAG

Find the heaviest path in a task dependency graph.

AdvancedGraphsHackathonTopological-sort
No solutions yet
Hard

Matrix Chain Multiplication

Find the cheapest order to multiply a chain of matrices.

AdvancedCompetitive-programmingDynamic-programming
No solutions yet
Hard

Minimum Window Substring

Find the shortest piece of text containing all required characters.

AdvancedCompetitive-programmingSliding-windowStrings
No solutions yet

Introduction

This online JSON beautifier helps you format unstructured JSON into a clean, readable layout. Powered by the Pretty Diff beautifier, it allows you to view the results in either a code view or a tree view for better visualization.

How to Use This Tool

To get started, simply paste your JSON code directly into the editor or upload a JSON file using the **Upload** button. Once the beautification process is complete, you can download the formatted JSON, save it, or share it with others using a unique link. Signing in with Google or GitHub lets you save results to your account for future use.

What is JSON?

JSON (JavaScript Object Notation) is a lightweight, open-standard data format that uses human-readable text to represent data objects consisting of attribute-value pairs and arrays. It is widely used for data interchange, particularly as a simpler alternative to XML in AJAX systems.

JSON’s popularity stems from its simplicity and versatility, making it a go-to format for APIs, configuration files, and other data-sharing tasks. Learn more

JSON Syntax

JSON defines two main structures: objects and arrays.

  • **Objects**: A collection of name-value pairs enclosed in curly braces `{}`.
  • **Arrays**: A list of values enclosed in square brackets `[]`.

JSON supports seven data types: string, number, object, array, `true`, `false`, and `null`. Below is an example of a JSON object containing name-value pairs. The "phoneNumbers" key holds an array of two objects:

      
{
  "firstName": "Duke",
  "lastName": "Java",
  "age": 18,
  "streetAddress": "100 Internet Dr",
  "city": "JavaTown",
  "state": "JA",
  "postalCode": "12345",
  "phoneNumbers": [
    {
      "Mobile": "111-111-1111"
    }, {
      "Home": "222-222-2222"
    }
  ]
}
      
    

Examples

Unbeautified:

      
{"colors":[{"color":"black","category":"hue","type":"primary","code":{"rgba":[255,255,255,1],"hex":"#000"}},{"color":"white","category":"value","code":{"rgba":[0,0,0,1],"hex":"#FFF"}}]}
      
    

After beautified:

      
{
  "colors": [
    {
      "color": "black",
      "category": "hue",
      "type": "primary",
      "code": {
        "rgba": [
          255, 255, 255, 1
        ],
        "hex": "#000"
      }
    }, {
      "color": "white",
      "category": "value",
      "code": {
        "rgba": [
          0, 0, 0, 1
        ],
        "hex": "#FFF"
      }
    }
  ]
}