Question 1

How does this tool convert JSON to TypeScript?

Accepted Answer

We parse your JSON string with the browser's native `JSON.parse`, walk the resulting tree, and infer a TypeScript type for every node. Primitives (string, number, boolean, null) map directly. Objects become named `interface` declarations (one per distinct nested object). Arrays become `T[]` or `(T1 | T2)[]` when heterogeneous. Names are derived from field names in PascalCase, deduplicated automatically when the same name would be reused.

Question 2

Why generate types from JSON instead of writing them by hand?

Accepted Answer

For real-world API responses, the JSON is often the source of truth — the server defines the shape and you, the client, follow. Hand-typing a 200-field response is tedious and error-prone. Generate once, paste, and you have correct types matching the actual payload. From there, you refine: rename interfaces, tighten unions, add brand types, mark fields readonly. The generated output is a starting point, not the final spec.

Question 3

Is my JSON sent to your server?

Accepted Answer

No. Parsing, type inference, and serialization all run in your browser via JavaScript. Your API responses with auth tokens, customer PII, billing data, or internal schema details never leave your device. We make no network requests to do this work.

Question 4

What is the difference between `interface` and `type` mode?

Accepted Answer

Functionally for plain object shapes, almost nothing. `interface Foo { … }` and `type Foo = { … }` produce identical type-checking results in most cases. Differences: (1) interfaces can be re-declared and merged (declaration merging) — useful for extending third-party types; (2) types can express unions and intersections directly, interfaces can't; (3) interface error messages are sometimes more readable. Pick `interface` for object-shape contracts, `type` if you anticipate adding unions later or your team uses `type` consistently.

Question 5

How does the tool handle null values?

Accepted Answer

When a field's value is literally `null` in the sample JSON, we mark the field optional (`field?: null`). This is conservative — in production code the same field is often `null | string` or `null | number`, but we can't know from a single sample. Pass multiple sample payloads and merge the generated types manually, or use a server-side tool like quicktype that supports multi-sample inference.

Question 6

What does "array union" mean and when should I disable it?

Accepted Answer

Array union is the difference between `[1, "two", true]` becoming `(number | string | boolean)[]` (union enabled) or `number[]` (union disabled — only the first element's type wins). Keep it ON when your arrays might be heterogeneous (rare in well-typed APIs but common in CMS exports and untyped JSON). Turn it OFF when you know arrays are homogeneous — the output is shorter and cleaner.

Question 7

Why are some of my JSON keys wrapped in quotes?

Accepted Answer

TypeScript requires quoted keys when the field name is not a valid JavaScript identifier — meaning it contains a hyphen (`first-name`), a dot (`user.id`), a leading digit (`1stPlace`), or is a reserved word. Our output uses double-quoted strings for these cases (`"first-name": string`) and unquoted identifiers everywhere else. This matches Prettier's default behavior.

Question 8

Can I generate types from multiple JSON samples?

Accepted Answer

Not in this offline tool — multi-sample inference requires merging type lattices across multiple parses and is significantly more complex. For that use case, run quicktype locally (`npm i -g quicktype`) or use its hosted service. For 90% of real workflows (one API endpoint, one sample), our tool generates correct types in one click without any network round-trip.

Question 9

How is this different from quicktype.io or transform.tools?

Accepted Answer

Three differences: (1) we run entirely in your browser, no upload; (2) we focus on the JSON → TypeScript path with full configurability instead of trying to cover 15 languages; (3) we are part of a privacy-first, ad-free tool platform with sibling tools (JSON Formatter, CSV ↔ JSON, YAML Validator) that share the same workflow. For the simple, common case, our output is identical to quicktype's. For multi-sample inference or polyglot output, use quicktype.

JSON Value	Inferred TypeScript	Notes
"hello"	string	Literal string types not inferred — use template literal types if needed
42, `3.14`	number	JavaScript has only one numeric type; integers and floats both → `number`
true, `false`	boolean	Maps directly
null	null (optional)	Field marked with `?:` — you likely want `null \| T` after inspection
{}	Named interface	One interface per nested object; PascalCase name from field
[…]	T[] or (T1 \| T2)[]	Union when heterogeneous; element name auto-singularized

Free JSON to TypeScript Interface Generator

Nested Interface Generation

Full Style Control

Heterogeneous Array Unions

100% Client-Side

From Untyped API Response to Production-Grade TypeScript in One Paste

JSON to TypeScript Type Mapping

A Type-Safe API Integration Workflow

After Generating: Five Quick Refinements

Related Developer & Data Utilities