# JSON to TypeScript Converter

Convert JSON data into TypeScript interfaces or type aliases with union types, optional fields, and nested object inference

> Canonical page: https://elysiatools.com/en/tools/json-to-typescript

- **Category:** Development

- **Keywords:** json, typescript, convert, interface, type, transform, codegen, json to typescript, schema inference, frontend, dto

## Overview

The JSON to TypeScript Converter simplifies frontend development by instantly transforming raw JSON payloads into strongly-typed TypeScript interfaces or type aliases. It automatically infers nested object structures, array types, and primitive values, allowing developers to quickly generate clean, production-ready type definitions for API responses and configuration files.

## Inputs

- **JSON Input** (textarea): { "name": "Alice", "age": 30, "roles": \["admin", "user"\], "address": { "city": "Shanghai", "zip": "200000" } }
- **Root Type Name** (text): Root
- **Export Style** (select)
- **Optional Fields** (checkbox)

## When to use

- When integrating a new REST or GraphQL API and you need to define TypeScript types for the JSON response payloads.
- When refactoring legacy JavaScript codebases to TypeScript and converting existing JSON configuration files into typed structures.
- When creating Data Transfer Objects (DTOs) or state management models based on mock JSON data.

## How it works

- Paste your raw JSON data into the input text area.
- Configure the root type name, choose between interface or type alias export styles, and toggle optional fields if needed.
- Copy the automatically generated TypeScript definitions directly into your codebase.

## Use cases

- Generating TypeScript interfaces for external API responses to ensure type safety in HTTP client requests.
- Creating type definitions for local JSON configuration files used in frontend projects.
- Rapidly prototyping component props by converting mock JSON payloads into TypeScript types.

## Frequently asked questions

### Can I generate type aliases instead of interfaces?

Yes, you can select either 'interface' or 'type' from the Export Style dropdown menu.

### How does the converter handle nested JSON objects?

The tool automatically infers nested structures and generates corresponding nested interfaces or inline types.

### Can I make all generated fields optional?

Yes, checking the 'Optional Fields' option will append a question mark to all generated properties.

### What happens if my JSON contains arrays?

The converter analyzes the array elements to infer the correct array type, including union types for mixed arrays.

### Do I need to upload a file to use this tool?

No, you simply paste your JSON text directly into the input field.

## Related tools

- [Data URI Generator](https://elysiatools.com/en/tools/data-uri-generator): Convert files into Data URIs (Base64 or percent-encoded) for inlining images, fonts, and assets directly into HTML, CSS, or Markdown
- [JSON Schema to Zod Schema Converter](https://elysiatools.com/en/tools/json-schema-to-zod-schema-converter): Convert JSON Schema JSON/YAML definitions into ready-to-use Zod schemas with nested objects, arrays, enums, and common validation rules
- [JSON to C# Class Converter](https://elysiatools.com/en/tools/json-to-csharp): Convert JSON data into C# classes with PascalCase properties, JsonPropertyName attributes, and nested type inference
- [JSON to Go Struct Converter](https://elysiatools.com/en/tools/json-to-go): Convert JSON data into Go struct definitions with json struct tags, exported PascalCase fields, and nested type inference
- [JSON to Java Class Converter](https://elysiatools.com/en/tools/json-to-java): Convert JSON data into Java classes with Jackson @JsonProperty annotations, private fields, getters, and setters
- [JSON to Kotlin Data Class Converter](https://elysiatools.com/en/tools/json-to-kotlin): Convert JSON data into Kotlin data classes with @SerializedName annotations, nullable handling, and nested type inference
- [JSON to Rust Struct Converter](https://elysiatools.com/en/tools/json-to-rust): Convert JSON data into Rust structs with serde Serialize/Deserialize derives, snake_case fields, and serde rename attributes
- [Log Sequence Diagram Converter](https://elysiatools.com/en/tools/log-sequence-diagram-converter): Convert structured service logs into Mermaid or PlantUML sequence diagrams, with optional latency and error annotations

## Samples

- [Terraform Plan JSON Samples](https://elysiatools.com/en/samples/terraform-plan-json-samples): Sample Terraform plan JSON files exported from terraform show -json style payloads for dependency visualization and change review
- [Web Data Serialization TypeScript Samples](https://elysiatools.com/en/samples/web-serialization-typescript): Web TypeScript data serialization examples including JSON serialization/deserialization and XML parsing
- [Chat Transcript JSON Samples](https://elysiatools.com/en/samples/chat-transcript-json): JSON examples for multi-role chat transcripts
- [JSON Samples](https://elysiatools.com/en/samples/json): JSON (JavaScript Object Notation) format examples from simple to complex structures

## Related content

- [JSON to Typed Code Generators](https://elysiatools.com/en/hubs/json-to-typed-code-generators): Generate typed models from JSON or schema evidence for TypeScript, Go, Rust, Kotlin, Java, C#, and Zod validation workflows.