JSON to TypeScript Types

Overview

The JSON-to-TypeScript converter produces interface (or type) definitions from a sample JSON document. Property names are kept as-is when valid TypeScript identifiers, quoted otherwise, and types are inferred from the source values.

Frontend and Node.js developers reach for a json to typescript converter when integrating a new API, mirroring a webhook payload as types, or generating fixtures for tests. Pasting a real response yields interfaces ready to import into a .ts file.

How it works

The generator walks the JSON tree, creating an interface for each object encountered. Type inference maps JSON to TypeScript: strings to string, integers and floats both to number (TS doesn't distinguish), booleans to boolean, arrays to T[] with T inferred across elements. Heterogeneous arrays become union types: (string | number)[].

Optional properties (those marked with ? after the property name) appear where keys are missing in some elements of an array of objects. Nullable properties (string | null) appear where the value is explicitly null in the sample.

Examples

Sample:
{ "id": 1, "name": "Alice", "tags": ["admin","ops"], "address": { "city": "Berlin" } }

interface Root {
    id: number;
    name: string;
    tags: string[];
    address: Address;
}

interface Address {
    city: string;
}

// Optional + nullable fields:
interface User {
    id: number;
    email: string | null;
    nickname?: string;
}

FAQ

Should I use interface or type?

Both work — pick based on your codebase's convention. interface is open for declaration merging; type is closed but supports unions and intersections directly. The generator can output either.

Does it handle keys with special characters?

Yes. Property names that aren't valid TS identifiers (digits at the start, hyphens, spaces) are quoted: "first-name": string. Access them in code with bracket notation: obj["first-name"].

Why not generate readonly properties?

Readonly is a stylistic choice, not derivable from a sample. Toggle the option to add readonly to every property if you're modelling immutable response data.

Try JSON to TypeScript Types