ConvertCaseTool

JSON to TypeScript

Press Ctrl+D to Bookmark

Paste any JSON and get clean TypeScript interfaces instantly. Handles nested objects, arrays, unions, and mixed types. 100% browser-based — your JSON is never uploaded.

export interface Root {
  id: number;
  name: string;
  email: string;
  isActive: boolean;
  createdAt: string;
  address: Address;
  tags: string[];
  posts: Post[];
  metadata: null;
}

export interface Address {
  street: string;
  city: string;
  postcode: string;
  country: string;
}

export interface Post {
  id: number;
  title: string;
  likes: number;
  published: boolean;
}

🔧 What This Tool Does

A free online JSON to TypeScript converter that takes any valid JSON and generates clean, ready-to-paste TypeScript interface (or type) declarations. Every nested object becomes its own named interface, arrays have their element types inferred, mixed-type arrays become union types, and empty arrays become unknown[].

Everything runs in your browser — your JSON is never sent to any server. No sign-up, no size limits, no rate limits. Perfect for generating type definitions from API responses, config files, or test fixtures.

How to Use

  1. Paste JSON — from an API response, config file, or any source
  2. Set the root interface name — e.g. "User", "ApiResponse", "Product"
  3. Pick options — interface vs type, export, all-optional
  4. Copy the generated TypeScript — paste directly into your .ts file

🧩 How Type Inference Works

Nested objects

Each nested object becomes its own named interface. The name is derived from the property key, converted to PascalCase.

Arrays

The element type is inferred from items. Uniform arrays → Type[]. Mixed arrays → (A | B)[]. Empty arrays → unknown[].

Duplicate structures

Identical object shapes are deduplicated — the same interface is reused instead of being generated multiple times with different names.

Null values

Null values are typed as null. Enable "All optional" to also mark such properties with ? for nullable + missing support.

🎯 Common Use Cases

🌐 API response types

Make a fetch/axios call in your browser devtools, copy the JSON, paste here, get types. Paste them into your TypeScript project and you have instant type safety for that endpoint.

⚙️ Config file types

Generate types for config files, manifests, and JSON schemas so your code editor autocompletes the shape.

🧪 Test fixtures

Convert existing test fixtures into types so your tests are type-safe and refactor-friendly.

📚 Learning TypeScript

Paste familiar JSON to see how it maps to TypeScript types — a great way to learn the type system hands-on.

🔒 Privacy

  • Conversion runs entirely in your browser using JavaScript
  • Your JSON is never sent, stored, or logged
  • Works offline after the page first loads
  • Safe for proprietary API responses and internal data shapes

Frequently Asked Questions

What does this tool do?

It takes any valid JSON and generates TypeScript interface (or type alias) definitions that match its structure. Nested objects become separate interfaces, arrays have their element types inferred, mixed-type arrays become union types, and you get a complete set of type definitions you can paste directly into your TypeScript project.

How does it handle nested objects?

Each nested object is extracted into its own named interface. The interface name is derived from the property key (converted to PascalCase). For example, a property "userProfile" becomes interface "UserProfile" that is referenced from the parent.

How does it handle arrays?

The element type is inferred from the first item. If all items have the same type, the result is "Type[]". If items have different types, the result is a union like "(string | number)[]". Empty arrays become "unknown[]".

How does it handle null values?

Null values produce the literal "null" type. For a complete solution, enable "All properties optional" and the property will be marked with a "?" so null and missing values both work.

Can I use interface or type?

Yes. Toggle between "interface" and "type" — interfaces are the TypeScript default and support declaration merging; type aliases are sometimes preferred for union types or for aliasing primitives. Both work for describing object shapes.

Is my JSON sent anywhere?

No. The conversion runs entirely in your browser using JavaScript. Your JSON is never sent, stored, or logged. You can disconnect from the internet after the page loads and it will still work.

What if my JSON is invalid?

If the JSON fails to parse, the tool shows the exact parse error (usually a line and column number) so you can fix it. JSON is strict — no trailing commas, no comments, all keys quoted. Paste it into a JSON validator first if you are not sure.

Does it handle API responses from real backends?

Yes. Paste any API response JSON directly and get interfaces matching its shape. This is one of the most common use cases — generating types for fetch/axios responses in a TypeScript project.

🔗 Related Tools