JSON to TypeScript

Developer

Turn a JSON object or API response into TypeScript interfaces, with nested objects extracted into their own types and mixed-type arrays described as unions.

Runs entirely in your browser. Nothing is uploaded.

Root interface nameMark null fields optional

export interface Root {
  id: number;
  name: string;
  tags: string[];
  profile: Profile;
}

export interface Profile {
  city: string;
  verified: boolean;
}

Types are inferred from one sample, so they describe that payload rather than the API's real contract. A field that happens to be null in the sample cannot be narrowed further, and an empty array becomes unknown[] — widen those by hand once you know the shape.

Generate interfaces from JSON

Typing an API response by hand is tedious and error-prone, and the usual result is an interface that drifts out of step with the payload it describes. Paste a real response here and get TypeScript interfaces generated from its actual shape: nested objects become their own named types, arrays are typed from their contents, and anything genuinely unknowable is reported as such rather than guessed at.

How to convert JSON to TypeScript

1
Paste your JSON
A real response or object works best — the more representative, the better the types.
2
Name the root
Set the top-level interface name; nested types are named from their keys.
3
Copy the interfaces
Take the generated TypeScript straight into your project and refine as needed.

Good to know

Nested objects are extracted into their own exported interfaces and referenced by the parent, rather than inlined as anonymous types.
Mixed-type arrays become a union such as (string | number)[], which describes the data honestly instead of flattening it.
An empty array becomes unknown[] and a null field stays null, because a single sample genuinely does not reveal the intended type.
Types describe your sample, not the API's contract — a field that is optional upstream but present in your sample will look required.

What people use it for

Typing a third-party API response you have no published types for
Bootstrapping interfaces for a payload you are about to consume
Checking whether a response matches the shape your code expects

Frequently asked questions

How are nested objects handled?+

Each nested object becomes its own exported interface, named from its key, and referenced by the parent. Structurally identical shapes are reused rather than duplicated.

What happens with mixed-type arrays?+

The element types are combined into a union, so an array holding strings and numbers becomes (string | number)[] rather than being flattened to one type.

Why did a field come out as unknown?+

An empty array gives no element to inspect, and a null value cannot be narrowed to a real type. Both are reported honestly instead of guessed at — widen them by hand.

Are these types safe to trust?+

They describe the one sample you pasted, not the API's contract. A field that is optional in the API but present in your sample will look required, so check against the API documentation.

Is my data sent to a server?+

No. Generating types happens entirely in your browser using built-in web APIs. Nothing is uploaded, stored, or logged.

Related tools

JSON Formatter

Beautify, minify & validate JSON

Base64 Encode / Decode

Text ⇄ Base64

URL Encode / Decode

Escape & unescape URL components

JWT Decoder

Inspect JSON Web Tokens

Or browse all 50 free tools.