Data Formatters & Converters Processed locally

JSON to TypeScript

Paste a real API response and get TypeScript interfaces you can drop into your project. Nested objects become their own named interfaces, arrays are inspected element by element and merged, fields missing from some elements are marked optional, and conflicting primitives become a union. Useful when an API has no OpenAPI spec, or when the published types have drifted from what is actually on the wire.

Generates as you type. Ctrl+Enter to re-run.

Guide & FAQ

Generate TypeScript declarations from a JSON sample, in the browser. The generator merges every element of an array rather than typing the first one, so a field that appears in only some records comes out optional and a field that is a string in one record and a number in another comes out as a union - which is what makes the output match the payload actually on the wire rather than the one in the documentation. Nothing is uploaded, so a production response with customer data is safe to paste.

What it does
  • Generates interfaces (or type aliases) from any JSON value, naming nested objects after the key that holds them.
  • Merges array elements - every item is inspected, and the result is one type that describes them all.
  • Marks optional fields when a key is absent from some elements of an array.
  • Builds unions when a field holds different primitive types across records.
  • Quotes unsafe keys and avoids reserved words, so the output compiles as written.
  • Lists the field inventory - every path, its inferred type and whether it is required.
When to use it
  • Integrating an API that ships no OpenAPI spec or SDK.
  • Typing a webhook payload from a sample delivery.
  • Checking whether the published types still match a live response.
  • Turning a fixture file into types for a test suite.
  • Converting a JSON config into a typed settings interface.
  • Getting a starting point for a Zod or io-ts schema.
How to use it
  1. Paste a JSON sample - ideally a real response with several array elements, so optional fields are detected.
  2. Choose interface or type alias, and whether declarations should be exported or readonly.
  3. Copy or download the generated .ts file.
  4. Rename Root to something meaningful for your domain.
  5. Open Field inventory to review every path and its inferred type.
FAQ

FAQ

  • How do I generate TypeScript from JSON? Paste the JSON sample - declarations are generated as you type. Nested objects become their own interfaces and arrays are merged into a single element type.
  • Does it handle arrays whose items differ? Yes. Every element is inspected and the shapes are merged: fields present in only some elements become optional, and conflicting primitive types become a union such as string | number.
  • What happens to null values? A field that is null in the sample is typed as null; if it is a string elsewhere in an array it becomes string | null. Enable the nullable option to emit field?: T | null instead.
  • Should I use interface or type? Interfaces are the common choice for object shapes because they can be extended and merged. Type aliases compose better with unions, intersections and mapped types. Both are available.
  • Can I use the output with Zod or io-ts? The output is plain TypeScript, so it is a starting point rather than a runtime validator. Generate the interface here, then mirror it in your validation library.
  • Why is my field typed as unknown? It came from an empty array, so there was no element to infer from. Add one representative element to the sample and the type follows.
  • Is my JSON uploaded? No. Parsing and code generation run entirely in your browser, which is why a production payload is safe to paste here.

Runs locally in your browser. No uploads. Share links use an encrypted URL fragment.