JSON to TypeScript
Paste a JSON object or API response and get ready-to-use TypeScript interfaces or type aliases, with properly named nested types and optional fields worked out from your data. Conversion runs entirely in your browser.
Your JSON is parsed locally in this tab and never uploaded. Tip: Ctrl + Enter generates.
How to use the JSON to TypeScript
- Paste your JSON (an object, an array or an API response) into the left box, or open a .json file.
- Name the root type, for example User or ApiResponse.
- Pick the options: interface or type alias, export, readonly, optional properties and array style.
- Press Generate TypeScript. With Live update on, the output changes as you type.
- Copy or download the .ts file and import the types in your project.
Example: from JSON to interfaces
Given this response, where the second post has an extra field and the first has none:
{ "id": 1, "name": "Ada", "deletedAt": null,
"posts": [ { "id": 1, "title": "Hello" },
{ "id": 2, "title": "Draft", "cover": "a.png" } ] }the generator produces:
export interface Root {
id: number;
name: string;
deletedAt: null;
posts: Post[];
}
export interface Post {
id: number;
title: string;
cover?: string;
}How JSON values map to TypeScript
| JSON value | TypeScript type |
|---|---|
"text" | string |
42, 3.14, -1e3 | number (TypeScript has no separate integer type) |
true / false | boolean |
null | null, or T | null when other samples have a value |
{ … } | A named interface or type |
["a", "b"] | string[] |
[1, "two", null] | (number | string | null)[] |
[] | unknown[] |
| Key missing in some array items | Optional property key?: T |
Tips for accurate types
- Use real, varied samples. Types are inferred from the data you paste. Include an array with several items so optional fields and nulls show up.
- Dates stay strings. JSON has no date type, so ISO timestamps are typed as
string. Convert them withnew Date()after parsing. - Narrow string unions by hand. A field like
"status": "active"is typed asstring; change it to'active' | 'banned'if you know the possible values. - Validate at runtime. TypeScript types disappear after compilation. For untrusted API data, add runtime validation (for example with a schema library) as well.
Need to tidy the JSON first? Use the JSON Formatter or explore it in the JSON Viewer.
Frequently asked questions
How are optional properties detected?
When an array contains several objects, the converter merges them into one type. A key that is present in only some of the items is marked optional with ?, because your data shows it can be missing. With a single example object, every key is required unless you tick All properties optional.
How are null values typed?
A null value adds null to the property's type. If other samples of the same property have a value, you get a union like string | null; if the property is only ever null, its type is just null, and you may want to replace it with the real type by hand.
Interface or type alias: which should I use?
Both describe object shapes equally well. Interfaces can be extended and merged and give slightly clearer error messages; type aliases are needed for unions and mapped types. Many style guides use interfaces for object shapes, which is the default here.
How are nested types named?
Each nested object gets a PascalCase name from its key: profile becomes Profile, avatar_url-style keys become AvatarUrl, and array keys are singularised, so posts becomes Post and categories becomes Category. Clashing names get a number, and objects with exactly the same shape share one type.
What happens with empty arrays and objects?
An empty array becomes unknown[] because there is no item to learn from, and an empty object becomes an empty interface. Add a sample item, or edit the type afterwards.
Are keys with dashes or spaces supported?
Yes. Keys that are not valid JavaScript identifiers, such as email-notifications or 2fa, are written in quotes, for example "email-notifications": boolean.
Is my JSON uploaded?
No. Parsing and type generation are pure JavaScript running in this page, so API responses with personal or secret data stay on your device.