JSON to TypeScript

How to use JSON to TypeScript

1. Paste a representative JSON sample into the left box, or press Load sample.
2. Choose a root type name, and whether to declare with interface or type.
3. Tick or untick export depending on whether you want the declarations exported.
4. Copy the generated TypeScript into your project.

Why generate types from JSON

TypeScript catches mistakes at compile time, but only when it knows the shape of your data. Data from a REST API, a configuration file or a third-party webhook arrives as untyped JSON, and writing interfaces for large responses by hand is slow and error-prone. Generating a first draft from a real sample gives you autocomplete and type checking in minutes.

This generator infers types directly from the structure of the JSON you paste. It runs entirely in your browser, so it is safe to use with real responses that contain private information.

How inference works

Primitive values become string, number or boolean. Objects become named interfaces, with the name taken from the key that contains them (for example, a key called orders holding objects produces an Order interface). Arrays are scanned item by item and merged into one element type.

• A value that is null in some places and a string in others becomes string | null.
• Arrays holding different kinds of values become unions such as (string | number)[].
• Keys that are not valid identifiers, such as "first-name", are quoted.
• If two nested objects would get the same name, a number is added to keep names unique.
• A top-level array or primitive produces a type alias.

Use it as a starting point

Treat the output as a draft. Rename interfaces to match your domain, tighten string fields to literal unions where you know the allowed values, and replace numbers that are really identifiers or dates with more specific aliases. For strict runtime safety, pair your types with a validation library, because TypeScript types are erased at runtime and do not check incoming data.

Also remember that one sample cannot reveal everything. Optional fields, rarely populated arrays and fields that are sometimes null may not appear in a small sample. Paste an array that combines several records to let the tool merge them and mark optional keys correctly.

Why use this json to typescript tool

• Nested interfaces. Each nested object gets its own named interface, named from its key and de-duplicated.
• Smart array merging. All items in an array are merged: keys missing from some items become optional, and differing value types become a union.
• null and union types. A field that is sometimes null becomes string | null, for example.
• Interface or type. Output either interface declarations or type aliases, with optional export.

Frequently asked questions

More free tools