JSON to TypeScript Interface Generator

Paste a JSON sample and instantly generate clean TypeScript interfaces, complete with nested types, optional properties, and unions for mixed values.

JSON to TypeScript features

Nested Interface Inference

Every nested object gets its own named interface, keeping deeply structured JSON clean and readable.

Array Merging

Arrays of objects are merged into a single interface so you describe the element shape once.

Optional Properties

Keys missing from some array elements are automatically marked optional with a ? modifier.

Union Types

Properties with mixed values across the sample become unions like string | number.

Deterministic Output

The same JSON always produces the same interfaces, so results are predictable and diff-friendly.

100% Client-Side

All conversion happens locally in your browser—your JSON is never uploaded to any server.

Overview

TypeScript interfaces describe the shape of your data so the compiler can catch mistakes before your code ever runs. Writing them by hand from an API response or config file is tedious and error-prone, which is exactly what this tool removes.

This JSON to TypeScript generator reads a JSON sample and produces matching interface definitions. It infers each property's type from the value—string, number, boolean, arrays, and nested objects—and gives every nested object its own named interface so the result stays readable.

When it sees an array of objects, it merges every element into a single interface. Any key that is missing from some elements is marked optional with a ?, and properties that hold more than one type across the sample become a union such as string | number. A Root name field lets you set the name of the top-level interface.

The conversion is fully deterministic and runs entirely in your browser, so the same JSON always yields the same interfaces and none of your data leaves your machine.

How to use the JSON to TypeScript

Paste or type your JSON sample into the input panel.
Enter a name in the Root name field to label the top-level interface.
Watch the matching TypeScript interfaces generate automatically in the output panel.
Review nested interfaces, optional properties marked with ?, and any unions for mixed types.
Copy the generated TypeScript and paste it into your project.

Good to Know

Good to know:

The output reflects only the sample you provide. If a field is always present in your sample but optional in reality, it won't be marked with ?—use a representative sample for best results.
Types are inferred from values, so an empty array becomes a generic array type and null values may surface in unions rather than as a specific type.
This is a one-way generation from JSON to TypeScript; it does not convert TypeScript back into JSON.

Private by design

Every byte you paste into the JSON to TypeScript is processed locally in your browser. Formatly makes no network request with your data, logs nothing, and stores nothing on any server — so it is safe for API responses, tokens, configuration and other sensitive content. Your most recent input and theme are saved only in your own browser's local storage.

JSON to TypeScript FAQ

Is my JSON data private and safe?

Yes. This tool runs entirely in your browser. Your JSON is never uploaded, stored, or sent to any server, so even sensitive or proprietary data stays on your own machine.

Does this work offline?

Yes. Once the page has loaded, the generator works without an internet connection because all processing happens locally in your browser using client-side JavaScript.

How does it handle an array of objects?

It merges every object in the array into one interface. If a key appears in some elements but not others, that property is marked optional with a ?. If a property holds different types across elements, the tool produces a union such as string | number.

What does the Root name field do?

The Root name field sets the name of the top-level interface generated from your JSON. Nested objects are given their own derived interface names automatically.

Can I generate types from any JSON sample?

Yes. Paste any valid JSON object or array. The tool infers types from the values it sees, so the more complete and representative your sample is, the more accurate the generated interfaces will be.

Why are some properties marked with a question mark?

A ? means the property is optional. This happens when a key exists in some objects of an array but is missing from others, signaling that the property may not always be present.