Skip to content
SyntaxSnap

JSON to TypeScript

Paste an API response to generate TypeScript interfaces. Nested objects become named types, and fields that only some array items have are marked optional.

JSON

TypeScript

export interface User {
  id: number;
  login: string;
  profile: Profile;
  repos: Repo[];
  created_at: string;
}

export interface Repo {
  name: string;
  stars: number;
  private: boolean;
  topics: string[];
  archived?: boolean;
}

export interface Profile {
  name: string;
  company: null;
  location: string;
}
Keys missing from some array items are marked optional

How to convert JSON to TypeScript

  1. Step 1

    Paste a JSON sample

    Paste a real response from your API. More varied samples give more accurate types.

  2. Step 2

    Set the options

    Name the root type and choose interface or type, export and readonly.

  3. Step 3

    Copy the types

    Copy the result into your project or download types.ts.

How types are inferred

Each nested object becomes its own interface, named after its key, so profile becomes Profile and an array called repos holds Repo items. When array items have different keys, they are merged into one type and keys missing from some items are marked optional with ?.

Null values

A field whose sample value is null is typed as null, because one sample cannot show what else it may hold. Replace it with the real type, for example string | null, once you know it.

Types are not validation

TypeScript types disappear at runtime, so they cannot catch an API that changes shape. If you need runtime checks, generate a schema with JSON to Zod and infer the type from it.

Questions and answers

Is my JSON uploaded anywhere?

No. The conversion runs in your browser and nothing is sent to a server.

Should I use interface or type?

Both work for object shapes. Interfaces can be extended and merged; type aliases can express unions. Many teams pick one for consistency, and the output switches with one click.

How are arrays with mixed items handled?

Objects in the same array are merged into one type. Primitive values of different kinds become a union, such as (string | number)[].

Can I generate Zod schemas instead?

Yes. Use the JSON to Zod tool for a runtime schema, then use z.infer to get the TypeScript type from it.

Related tools

All JSON & Schema tools
Pydantic to Zod Convert Python Pydantic models and FastAPI JSON schemas into TypeScript Zod validation schemas. Client-side processing, zero data transmission. JSON to Zod Paste any JSON object and infer a complete Zod validation schema with nested types, optionals, and arrays. No server round-trips — 100% in-browser. JSON Schema to Zod Convert JSON Schema definitions into type-safe Zod validation schemas. Supports nested objects, arrays, and complex constraints with zero data transmission. OpenAPI to Zod popular Parse OpenAPI 3.x specifications and instantly generate TypeScript Zod validation schemas for all components. 100% client-side execution. JSON Formatter & Beautifier new Beautify or minify JSON with exact error line and column, a tree view, sort keys and one-click repair. Opens files up to 50 MB, all in your browser. Aurora Gradient Generator popular Create animated, pure CSS aurora backgrounds and mesh gradients. Generate Tailwind classes or raw CSS instantly. 100% local, privacy-first execution.

Next step

TypeScript to ZodJSON to ZodTypeScript to JSON SchemaJSON Formatter

Need this built into your stack?

The team behind SyntaxSnap builds custom code generators, internal developer tools and API integrations.

Chrome extension