JSON to TypeScript
Paste sample JSON, such as an API response, to get TypeScript interfaces. Every record is taken into account, so missing keys become optional, mixed values become unions and nested objects get their own named types.
- 100% free
- Runs in your browser
- No uploads
- Runs on your deviceEvery tool works directly in your browser. No files are uploaded.
- Your privacy mattersYour files never leave your device, so there's nothing for us to store.
- No limitsUse any tool as much as you need. No daily caps, no waiting.
- Completely freeNo signup and no trial to cancel. Ads keep the tools free.
How to convert JSON to TypeScript
- Paste a sample. Use real data with several records if you can: the more examples, the more accurate the optional fields and unions.
- Name the root type. Root by default. For an array, the item type is named after it, for example UserItem for User.
- Pick the style. interface or type, with or without export and readonly.
- Copy or download types.ts. Paste it into your project and rename types to match your code.
Example: two users with different fields
[
{ "id": 1, "name": "Ada", "email": "ada@example.com", "roles": ["admin"], "manager": null },
{ "id": 2, "name": "Alan", "roles": [], "manager": { "id": 1, "name": "Ada" } }
]generates:
export type Root = RootItem[];
export interface RootItem {
id: number;
name: string;
email?: string;
roles: string[];
manager: Manager | null;
}
export interface Manager {
id: number;
name: string;
}email is optional because the second user doesn't have it, manager is an object in one record and null in the other, and the empty roles list doesn't hide the fact that the other one holds strings.
How JSON maps to TypeScript
| JSON | TypeScript |
|---|---|
"text", 42, true | string, number, boolean |
null only | null (the sample doesn't show the real type) |
[1, 2] | number[] |
[1, "a"] | (string | number)[] |
[] | unknown[] |
{} | Record<string, unknown> |
Key "first-name" | "first-name": string; |
What a sample can't tell you
Types inferred from data describe that data, not the API's contract. A field that was never null in your sample may still be null tomorrow, and strings that are really dates or IDs show up as plain string. Review the output, narrow types where you know more (for example status: "paid" | "refunded"), and if the API publishes an OpenAPI or JSON Schema file, generating types from that is more reliable.
At runtime, TypeScript types don't check anything. If the data comes from outside your program, validate it as well, for example with a schema library.
Frequently asked questions
How does it decide which fields are optional?
All objects found at the same place are compared, such as every item of an array. A key that appears in some of them but not all is marked optional with ?. With one sample object there's nothing to compare, so every field is required; paste a few records to get accurate optional fields.
What happens when a field has different types?
You get a union. If id is 1 in one record and "u-2" in another, the type is string | number. A field that is sometimes null becomes, for example, string | null. Tick Make null fields optional to also add ?, which suits APIs that leave such fields out.
How are nested types named?
After their key, in PascalCase: billing_address becomes BillingAddress. Arrays use the singular, so users gives User and categories gives Category. If two different shapes would get the same name, the second is prefixed with its parent's name. Names that clash with built-in types, like Date or Location, get Data added.
Does the output really compile?
It's tested with the TypeScript compiler in strict mode, with and without export, for both interface and type output. Keys that aren't valid identifiers, like first-name or 2fa, are quoted, and identical nested shapes share one declaration so there are no duplicates.
Should I use interface or type?
For object shapes they behave almost the same. Interfaces can be extended and merged, and many style guides prefer them for objects; type aliases are needed for unions. The root of an array or a single value is always a type alias, because an interface can't describe it.
Is it safe to paste real API responses?
Yes. The types are generated in your browser and nothing is uploaded. It's still worth removing tokens or personal data from samples you share with others.