Code Formatting Tools

What it does

Compares two JSON objects and shows differences: added keys (green), removed keys (red), and changed values (yellow). Works recursively on nested objects.

How to use

• Paste original JSON in the left box (JSON A)
• Paste modified JSON in the right box (JSON B)
• Click Compare to see the diff

Sample input

JSON A:

{"name": "Alice", "age": 25, "role": "developer"}

JSON B:

{"name": "Alice", "age": 26, "title": "engineer"}

Sample output

Shows age changed from 25 → 26, role removed, title added.

Real-world use cases

• Comparing API responses before and after a change
• Reviewing config file differences
• Debugging data transformation issues
• Verifying migration script output

What it does

Pretty-prints XML with proper indentation and line breaks, or minifies it by removing all unnecessary whitespace. Validates XML structure.

How to use

• Paste your XML into the input box
• Choose indentation level
• Click Format to beautify or Minify to compress

Sample input

<root><person><name>John</name><age>30</age></person></root>

Sample output

<root>
  <person>
    <name>John</name>
    <age>30</age>
  </person>
</root>

Real-world use cases

• Formatting SOAP API responses
• Making XML config files readable (web.config, pom.xml)
• Debugging RSS/Atom feeds
• Minifying XML for storage or transmission

What it does

Beautifies HTML code with proper indentation and line breaks. Handles self-closing tags, nested elements, and preserves text content. Also minifies HTML by removing extra whitespace.

How to use

• Paste your HTML into the input box
• Select indentation preference
• Click Beautify to format or Minify to compress

Sample input

<div><h1>Hello</h1><p>World</p><ul><li>Item 1</li><li>Item 2</li></ul></div>

Sample output

<div>
  <h1>Hello</h1>
  <p>World</p>
  <ul>
    <li>Item 1</li>
    <li>Item 2</li>
  </ul>
</div>

Real-world use cases

• Cleaning up minified HTML from view-source
• Formatting email templates for editing
• Making WordPress or CMS-generated markup readable
• Preparing HTML snippets for documentation

What it does

Beautifies CSS with proper indentation, one property per line, and consistent spacing. Also minifies CSS by removing comments, whitespace, and line breaks.

How to use

• Paste your CSS into the input box
• Choose indentation level
• Click Beautify to format or Minify to compress

Sample input

.container{display:flex;gap:12px;padding:16px}.title{font-size:24px;color:#333;font-weight:bold}

Sample output (beautified)

.container {
  display: flex;
  gap: 12px;
  padding: 16px;
}

.title {
  font-size: 24px;
  color: #333;
  font-weight: bold;
}

Real-world use cases

• Formatting minified CSS from production sites
• Cleaning up CSS before code review
• Minifying CSS for faster page loads
• Making vendor CSS readable for customization

What it does

Beautifies JavaScript code by adding proper indentation, line breaks after braces and semicolons, and consistent spacing around operators. Also minifies by removing whitespace.

How to use

• Paste your JavaScript code into the input box
• Select indentation preference
• Click Beautify to format or Minify to compress

Sample input

function greet(name){if(name){console.log("Hello, "+name)}else{console.log("Hello, World")}}

Sample output

function greet(name) {
  if (name) {
    console.log("Hello, " + name)
  } else {
    console.log("Hello, World")
  }
}

Real-world use cases

• Formatting minified JavaScript for debugging
• Cleaning up one-liner code snippets
• Making bookmarklet code readable
• Quick formatting before pasting into docs

What it does

Parses and re-formats YAML with consistent indentation, validates YAML structure, and converts between YAML and JSON formats.

How to use

• Paste YAML or JSON into the input box
• Click Format YAML to re-indent YAML
• Click YAML → JSON to convert YAML to JSON
• Click JSON → YAML to convert JSON to YAML

Sample input (YAML)

name: John Doe
age: 30
address:
  city: NYC
  zip: "10001"
hobbies:
  - reading
  - coding

Sample output (JSON)

{
  "name": "John Doe",
  "age": 30,
  "address": {
    "city": "NYC",
    "zip": "10001"
  },
  "hobbies": [
    "reading",
    "coding"
  ]
}

Real-world use cases

• Formatting Kubernetes YAML manifests
• Converting Docker Compose files to JSON
• Validating CI/CD pipeline YAML (GitHub Actions, Azure Pipelines)
• Converting between config formats

What it does

Generates strongly-typed class/model definitions from JSON data. Supports C#, Java, Python, and TypeScript. Handles nested objects (generates separate classes) and arrays.

How to use

• Paste a JSON object into the input box
• Select your target language
• Optionally change the root class name
• Click Generate

Sample input

{"id": 1, "name": "John", "isActive": true, "address": {"city": "NYC", "zip": "10001"}}

Sample output (C#)

public class Address
{
    public string City { get; set; }
    public string Zip { get; set; }
}

public class RootObject
{
    public int Id { get; set; }
    public string Name { get; set; }
    public bool IsActive { get; set; }
    public Address Address { get; set; }
}

Real-world use cases

• Generating C# models from REST API responses
• Creating TypeScript interfaces for frontend development
• Building Java POJOs from JSON test data
• Creating Python dataclasses from config files