JSON to TypeScript Generator

Generate TypeScript interfaces from any JSON. Handles nested objects, arrays, union types, and optional properties. Free, runs in your browser.

100% Client-Side Your data never leaves your browser Free · No Sign-Up
JSON Input
TypeScript Output

How to Use

  1. Paste or type your JSON into the left panel. The tool validates it in real time and highlights errors.
  2. Optionally set a Root interface name (default: RootObject).
  3. Toggle Make properties optional if you want every field marked with ?.
  4. Toggle Use type instead of interface to switch the output keyword.
  5. Click Generate TypeScript to produce the interfaces.
  6. Click Copy to copy the output to your clipboard.

Type Inference Rules

  • nullnull
  • string → string
  • number → number
  • boolean → boolean
  • empty array → unknown[]
  • array of objects → merged interface + ItemName[]
  • array of mixed primitives → union, e.g. (string | number)[]
  • nested object → separate named interface

Example

Given this JSON:

{"user": {"name": "Alice", "age": 30}, "tags": ["admin", "user"]}

The tool generates:

interface User {
  name: string;
  age: number;
}

interface RootObject {
  user: User;
  tags: string[];
}

FAQ

What does this tool generate?

It generates TypeScript interface (or type alias) declarations from a JSON object. Each nested object becomes its own named interface. Array items with mixed types produce union types.

How are nested objects handled?

Each nested object field is extracted into a separate interface named after the field key in PascalCase. For example, a field named 'address' becomes an 'Address' interface, and the parent interface references it by name.

What happens with arrays of objects?

If an array contains objects, all objects are merged to form a single item interface. Fields present in some but not all objects are marked as optional.

What is the 'Make properties optional' option?

When checked, every property in every generated interface gets a '?' suffix, making it optional. Useful when you expect partial data or want a loose type definition.

What is the difference between interface and type?

Both declare object shapes in TypeScript. 'interface' supports declaration merging and is idiomatic for object types. 'type' is more flexible and can also represent primitives, unions, and tuples. Toggle 'Use type instead of interface' to switch.

Is my data sent to a server?

No. The entire type inference engine runs in your browser. No data leaves your machine.