JSON to TypeScript Interface Generator

About this tool

This JSON to TypeScript converter parses a JSON payload and generates TypeScript interface or type alias definitions that accurately represent the data structure. It handles nested objects (emitting separate named interfaces for each), arrays of objects (merging all array item shapes into a unified interface with optional fields where items differ), union types (when a field holds values of mixed types), null unions, and ISO 8601 date string detection (mapping date strings to the Date type). Options include an I-prefix convention for interfaces (e.g., IUser instead of User), null retention, and choice between interface and type alias output. All processing runs locally in your browser - no JSON is uploaded.

Real example

Input JSON (a user API response):

{
  "id": 42,
  "name": "Alice",
  "email": "[email protected]",
  "createdAt": "2024-01-15T09:30:00Z",
  "roles": ["admin", "editor"],
  "address": {
    "city": "Austin",
    "country": "US"
  },
  "deletedAt": null
}

Generated TypeScript (interface mode, I-prefix on, ISO as Date, keep null):

// Generated by onlinedevtools.app
export type Root = IRoot;

export interface IRoot {
  id: number;
  name: string;
  email: string;
  createdAt: Date;
  roles: string[];
  address: IAddress;
  deletedAt: null;
}

export interface IAddress {
  city: string;
  country: string;
}

Key behaviors: createdAt detected as ISO 8601 and typed as Date; nested address extracted as a separate IAddress interface; deletedAt: null typed as null (use "Keep null unions" to keep this, or disable to get unknown).

Common use cases

• API response typing: Paste a response from curl or your browser's DevTools network tab and get TypeScript interfaces ready to import in your React or Node.js project. Saves 5-15 minutes of manually writing out interfaces for complex API responses.
• Prototyping data models: During early feature development, paste example data and get a typed schema immediately. Use this as a starting point for your domain model, then refine with optional fields and stricter literal types as the shape stabilizes.
• SDK and client library generation: When consuming a third-party REST API without an official TypeScript SDK, paste a few representative payloads here to generate typed interfaces. Use them to add type safety to fetch wrappers without waiting for a full OpenAPI-based code generation setup.
• Array of objects from database queries: Paste a JSON array returned from a database or ORM and get a typed interface for the row shape. The generator merges all array item shapes, so fields that only appear in some items become optional (field: type).

How it works

The generator uses recursive type inference on the parsed JSON value tree. Primitive values map directly: JSON numbers -> number, booleans -> boolean, strings -> string (or Date if ISO 8601 detection is enabled). JSON objects are assigned a PascalCase interface name derived from their path in the object tree (e.g., a nested key address inside root becomes IAddress). Arrays are analyzed by iterating all items - if items are objects, their shapes are merged with a union of all keys; keys that appear in only some items become optional. When an array contains both primitive and object values, a union type is generated (e.g., (string | IItem)[]). Circular references are detected by WeakMap and will not cause infinite loops.

Common mistakes

• Single-item arrays producing over-specific types: If an array contains only one item, the generator infers the type from that single item. If that item happens to have all fields set, none will be marked optional - but in practice the API may omit some fields on other items. Always validate generated types against multiple representative API responses before using in production code.
• null fields typed as null instead of T | null: With "Keep null unions" enabled, a field with a null value is typed as null - not string | null. This is because the generator only has one sample value. If the field can also be a string, you will need to manually update the type to string | null after generation.
• I-prefix convention mismatch: The I-prefix (e.g., IUser) was a common TypeScript convention historically recommended by Microsoft's style guide, but the current TypeScript ecosystem (including the official TypeScript style guide) no longer recommends it. Disable the I-prefix option if your codebase follows the modern convention of using plain User for interface names.

FAQ

What is the difference between interface and type alias output
export interface IUser { ... } and export type IUser = { ... }; are nearly equivalent in TypeScript. Interfaces support declaration merging (you can add fields later in a separate interface block); type aliases do not. For most API typing use cases, either works. The TypeScript team generally recommends interfaces for object types unless you need union or intersection types.

Does this handle JSON arrays at the root level
Yes. If the root JSON value is an array, the generator produces a export type Root = ItemType[]; alias and emits the inferred item interface. All item shapes are merged so the interface covers the full union of all item keys.

Can I use this with OpenAPI or JSON Schema
This tool generates TypeScript types from a JSON value (sample data), not from a JSON Schema or OpenAPI spec. For schema-driven generation, consider tools like json-schema-to-typescript or the OpenAPI Generator. Use this tool when you have a real API response and want quick typings without a formal schema setup.

Does this send my JSON to a server
No. Parsing and type generation run entirely in your browser using JavaScript. Your JSON payload never leaves your device, making it safe to paste API responses that contain sensitive data during development.