JSON to TypeScript

Runs in your browserDeveloper Tools#TypeScript#JSON

Generate TypeScript interfaces or types from JSON, with optional and nullable fields detected.

JSON

{
  "id": 1024,
  "name": "Rahul Verma",
  "email": "rahul@example.in",
  "is-verified": true,
  "address": { "city": "Bengaluru", "pincode": "560001" },
  "orders": [
    { "orderId": "OD101", "amount": 1499.5, "coupon": null },
    { "orderId": "OD102", "amount": 299, "coupon": "DIWALI10",
      "giftWrap": true }
  ]
}

TypeScript

export interface Root {
  id: number;
  name: string;
  email: string;
  "is-verified": boolean;
  address: Address;
  orders: Order[];
}

export interface Address {
  city: string;
  pincode: string;
}

export interface Order {
  orderId: string;
  amount: number;
  coupon: string | null;
  giftWrap?: boolean;
}

Valid JSONKeys missing from some items are marked optional (?).

How to use, limits & privacy

About JSON to TypeScript

Turn a sample of JSON, such as an API response, into TypeScript interfaces or types as you type. Every item of an array is looked at, so keys that are missing in some items become optional (?) and mixed values become unions such as string | null. Keys that are not valid names are quoted and nested objects get their own PascalCase names. It runs in your browser.

How to Use

Paste your JSON

Paste a JSON object or array into the JSON box, or click Example. The TypeScript appears on the right as you type.

Set the options

Enter a Root type name such as User or OrderResponse, choose interface or type under Declare as, and turn on readonly properties if you want immutable types.

Copy the types

Click Copy, or Download .ts to save types.ts, and paste the declarations into your project.

Privacy & Processing

Mode: local
Files Leave Browser: Local tool processing; review details below
Max Input Size: Device memory limits
Account Required: No
Data Stored Locally: Nothing is saved; the input stays in memory only while this page is open.
Network Processing: Assets or models may require an initial download

Your JSON is converted in your browser and is never uploaded.

Rules & Limitations

Types come from the sample only. A key that is null in every item becomes null, and an empty array becomes unknown[]; edit those to the real types.
Dates and IDs stay string or number, as JSON has no date type.
Objects with the same shape share one declaration. Two different shapes with the same key name get different names, such as Data and BData.
The output is not checked against your code; review it before use.

Top Suggestions

Typing the response of a REST API in a React or Angular app
Creating models for a Node.js or Next.js backend from sample data
Documenting the shape of a JSON config file
Learning how TypeScript describes optional and nullable fields

JSON to TypeScript FAQ

How do I convert JSON to a TypeScript interface?

Paste the JSON into this page and set a Root type name. The interfaces appear at once; click Copy and paste them into a .ts file.

How are optional fields detected?

All items of an array are merged. If a key appears in some items but not in others, it is marked optional with ?. If it is null in some items, null is added to its type, for example string | null.

What is the difference between interface and type in TypeScript?

For object shapes both work the same in most code. Interfaces can be extended and merged; type aliases can also name unions and arrays. Root arrays and plain values always use type here, for example export type Root = RootItem[].

Why are some keys in quotes?

Keys such as first-name or 2fa are not valid TypeScript names, so they must be quoted to compile. You then read them as obj["first-name"].

Is my JSON sent to a server?

No. The types are generated in your browser, so your data stays on your device and nothing is saved.