Can I convert TypeScript back to JSON?

Yes. Switch the Direction dropdown to "TypeScript → JSON" (or click the swap button between the panes) to parse interface and type declarations back into a sample JSON object.

What's the difference between the Interface and Type declaration options?

interface Name { ... } vs type Name = { ... };; both produce the same field structure, just with each declaration keyword's own syntax.

What do Readonly and Optional (?) do?

Readonly fields prefixes every property with readonly. Optional fields appends ? to every property name, making all fields optional instead of required.

How are nested object type names generated?

A nested object's type name is the parent type name plus the capitalized field name, e.g. a profile field inside User becomes its own UserProfile interface.

Can I upload a file instead of pasting?

Yes. Use the Upload button or drag a .json, .ts, or .txt file onto the input panel. Everything is parsed and converted locally, your data never leaves the browser tab.

JSON to TypeScript Generator

Convert JSON payloads into robust, nested TypeScript interface or type definitions instantly.

Private by architecture: All processing is 100% client-side memory. Your data never leaves this browser tab.

Direction

Root Name

Declaration

Export types Readonly fields Optional fields (?)

JSON input

0 lines · 0 charsJSON

TypeScript output

0 charsTypeScript

About This Tool

Generates nested TypeScript interface or type declarations from a JSON sample, inferring one named type per nested object, a profile field under User becomes its own UserProfile: and recursing through arrays and objects of any depth. The panel also runs in reverse, parsing existing declarations back into sample JSON.

For a Go equivalent, use JSON to Go Struct. For a runtime-validated schema rather than a compile-time type, use JSON to Zod & Valibot or the JSON Schema Validator.

Key Features

Direction toggle: JSON → TypeScript, or parse interface/type declarations back into sample JSON.
Configurable root name: names the top-level type; nested types inherit {parent}{field}.
interface or type declarations: switch keyword style without changing the field structure.
Export, readonly, and optional toggles: prefix every property with export/readonly, or make every field optional with ?.
File upload & drag-and-drop: load a .json or .ts file directly.

Example

With Root Name User, declaration interface, and Export types checked:

{
  "id": "usr_1",
  "verified": true,
  "profile": { "age": 32 }
}

produces:

export interface UserProfile {
  age: number;
}

export interface User {
  id: string;
  verified: boolean;
  profile: UserProfile;
}

FAQ

Can I convert TypeScript back to JSON?: Yes. Switch the Direction dropdown to "TypeScript → JSON" (or click the swap button between the panes) to parse interface and type declarations back into a sample JSON object.
What's the difference between the Interface and Type declaration options?: interface Name { ... } vs type Name = { ... };: both produce the same field structure, using each declaration keyword's own syntax.
What do Readonly and Optional (?) do?: Readonly fields prefixes every property with readonly. Optional fields appends ? to every property name, making all fields optional instead of required.
How are nested object type names generated?: A nested object's type name is the parent type name plus the capitalized field name, e.g. a profile field inside User becomes its own UserProfile interface.
Can I upload a file instead of pasting?: Yes. Use the Upload button or drag a .json, .ts, or .txt file onto the input panel. Everything is parsed and converted locally; your data never leaves the browser tab.