JSON to TypeScript Interface & Type Generator
Generate TypeScript interfaces from JSON in one paste. Infers nested types, unions, optional keys and arrays from any API response. Free, no upload.
TypeScript interface will appear hereโฆ
To convert JSON to TypeScript, paste an object or API response into the left pane. Each nested object becomes its own named interface, arrays are typed from their members, and keys missing on some objects are marked optional in the generated code on the right.
Generating TypeScript from JSON removes the most error-prone step in consuming an API: transcribing its response shape by hand. JSON2X walks the payload, gives every nested object its own named interface, types arrays from their members, and marks keys that are missing from some objects as optional. Generation is local, so you can paste a real authenticated response rather than a sanitised one.
How are nested objects and arrays typed?
Each nested object becomes its own named interface rather than an inline literal, so the output stays readable and the sub-types are reusable. Arrays are typed from their elements: an array of numbers becomes number[], an array of objects becomes Item[] with Item declared separately, and an array whose elements disagree becomes a union. An empty array cannot be inferred and falls back to unknown[], which is the honest answer โ any[] would silently disable checking.
How does it decide a field is optional?
By comparing objects at the same position. If you paste an array of records and a key appears in some but not all of them, that key is emitted with a ?. From a single object nothing can be inferred as optional, because every key present is present. This is the main reason to paste a list rather than one record: the variation in your sample is the only evidence the generator has about which fields the API actually guarantees.
What are the limits of generated types?
TypeScript types vanish at compile time, so a generated interface is a claim about the data, not a check on it. If the API changes, your code keeps compiling and fails at runtime instead. Nullable fields are the common gap โ a field that is null in your sample types as null, and one that is never null in the sample types as non-nullable even when the API disagrees. For anything crossing a network boundary, generate a Zod schema as well and derive the type from it, so the check and the type cannot drift apart.
How to use the JSON to TypeScript
Takes under a minute. Nothing is uploaded โ every step runs in this browser tab.
- Paste an API response
Put the object or array into the left-hand input pane. Prefer a record where optional fields are populated โ inference can only see what is present.
- Choose interface or type alias
Switch between `interface Foo {}` and `type Foo = {}` declarations, and name the root type.
- Read the generated types
The right-hand pane shows the root interface plus one named interface per nested object, in dependency order so the file compiles as pasted.
- Paste into your project
Drop the block into a .d.ts or types file, then widen any type you know the API can vary.
When to use it
- Typing a third-party API that ships no TypeScript definitions
- Creating types for a webhook payload you only have one example of
- Replacing `any` in an existing codebase with a shape derived from real data
- Generating props types from a JSON fixture used in tests
- Documenting an internal endpointโs response by checking its type into the repo
Step-by-step guides for this tool
Task-specific walkthroughs covering the most common ways this tool gets used.
Searches this page answers
- json to typescript online free
- free json to typescript converter
- json to interface generator
- typescript interface from json
- convert api response to typescript
- json to ts types
- quicktype alternative online
- json to typescript no upload
Frequently Asked Questions
How does JSON to TypeScript generation work?
The generator recursively traverses nested JSON objects and arrays, creating typed interface declarations with accurate property types (string, number, boolean, array, union, any).
Can I generate type aliases (type T =) instead of interfaces (interface T {})?
Yes. Switch between interface and type alias declaration modes in the options toolbar.
How do I turn an API response into a TypeScript interface?
Paste the response body and set the root name to match the endpoint โ UserResponse, for example. Nested objects become their own named interfaces, so you can copy the whole block into a types file and import from it immediately.
Can it mark properties as optional?
Yes. Enable the optional-properties toggle and keys are emitted as name?: type, which is the right shape when a field may be absent from some responses. There is also a toggle for adding export to each declaration.
Is this a free quicktype alternative that runs offline?
It is free with no account, and generation happens entirely in your browser โ no payload is uploaded. That makes it usable on API responses containing customer data, where a server-side generator would not be.
Related Developer Tools
- Standards & references:
- TypeScript
- JSON
Last reviewed by the JSON2X Engineering Team.