OnSumo Tools

JSON to TypeScript Type Generator

This tool generates TypeScript interfaces from any JSON object you paste in. It infers types for all properties, handles nested objects and arrays, names the output interfaces based on key structure, and produces ready-to-copy TypeScript code. Everything runs in your browser. Your JSON payload never leaves your device.

Valid JSON2 types generated

Generated TypeScript

export interface RootType {
  id: number;
  name: string;
  active: boolean;
  tags: string[];
  owner: Owner;
}

export interface Owner {
  email: string;
  role: string;
}

Generated types are inferred from sample data. Verify nullable and optional fields against your API contract.

Nested types

  • Owner
  • RootType

Type generation runs in your browser. JSON samples are not sent to a server.

How this tool works

The JSON-to-TypeScript converter infers a TypeScript interface from a JSON value by traversing the object graph and assigning each key a TypeScript type: string, number, boolean, null, typed arrays, and nested interfaces for object values. When a field appears in some array elements but not others, the tool marks it as optional (key?: type). When a field holds null in the JSON, the inferred type is the detected base type combined with null (string | null) unless every sample value is null, in which case the type falls back to unknown. Interface names are PascalCase-converted from the top-level input or from a name you provide. For arrays of mixed-type objects the tool merges all observed key-type pairs across every element into a single interface representing the superset of all observed fields. Key assumption: type inference is based entirely on the sample JSON provided. If a field can hold a string or number at runtime but only a string appears in the sample, the inferred type is string and will miss the number case. Always use a representative sample covering all value variations. Edge case: deeply recursive JSON structures, such as a tree where each node contains an array of children of the same shape, require a recursive interface definition. The tool detects self-referential shapes up to five levels deep and emits a recursive type alias using the interface's own name.

Worked example

An API returns a user object with nested address data. Paste the response JSON, keep extract named for arrays and objects, then copy the generated interfaces into your project.

Frequently asked questions

  • Does the tool send my JSON to a server?

    No. The entire conversion runs in your browser using JavaScript. Your JSON, which may contain sensitive API responses, tokens, user data, or internal payloads, never leaves your device. You can verify this by watching the Network tab in browser DevTools while using the tool: no outbound request is made.

  • How does it handle arrays with mixed types?

    If an array contains elements of different types (e.g., [1, \\\\\\\"two\\\\\\\", true]), the tool infers the type as unknown[] and adds a comment noting that the array contains mixed types. For arrays where all elements are objects with the same structure, it generates a single interface for the element type and types the array as ElementType[].

  • Should I use `interface` or `type` in TypeScript?

    Both work for object shapes. interface is preferred when you need to extend or implement the type later. type is more flexible and supports union types, intersections, and mapped types. The tool outputs interface by default. A toggle switches to type syntax if your codebase prefers it.

  • How do I handle date fields typed as string?

    JSON has no native date type. Dates in JSON are always strings (ISO 8601 by convention). The generated interface types them as string. If you want to work with Date objects in your code, add a transformation layer that converts the string to a Date after parsing. You can also manually change string to a branded type like ISODateString for documentation clarity.

  • What if the same nested object shape appears in multiple places?

    The current version generates a separate named interface for each occurrence, even if two nested objects have identical structures. You can manually merge duplicate interfaces after generation. A deduplication option that identifies structurally identical interfaces and consolidates them is planned for a future version.

  • Is the generated TypeScript compatible with strict mode?

    Yes, with one caveat. null values in the JSON are typed as null, which is correct in strict mode. If you use the \\\\\\\"mark null as optional\\\\\\\" setting, the generated property?: T | null is also strict-mode compatible. The tool does not generate any types for any inferred value.