Free online JSON to TypeScript interface tool, auto-generate interface and type, supports nested objects and arrays
TL;DR: Free JSON to TypeScript tool. Generates interface/type with key-named nested types, union types for mixed arrays, and smart optional/null handling.
For local tools, open DevTools → Network and search your input — it should not appear in requests.
Next steps
Usage Guide
Hand-writing interfaces from API JSON is where fields get missed and optionality goes wrong. This tool infers TypeScript types from a JSON sample: interface or type output, optional strategies, null handling, and nested objects split into named types — all generated locally.
1. Generate types
Inference quality follows sample quality: if a field is sometimes missing, show that absence or an explicit null, or it will look required. Arrays scan every element: mixed element types become a union (e.g. (string | number)[]), uniform object arrays merge into a single interface with optional fields for keys missing in some elements. Empty arrays become unknown[].
- Paste a representative JSON sample (cover real fields and nesting).
- Choose interface or type output and toggle export as needed.
- Tune optional mode (all optional / all required / smart) and null handling (any / unknown / optional), then copy into the project.
2. How to pick the options
- Smart optional: marks fields optional from null/undefined — good for real response samples.
- All required: when the contract is stable and you want the compiler to force missing fields.
- null → optional: treat null as "may be absent" instead of an any sink.
- Nested objects become types named after their key (address → Address, users → User) — rename once to domain language after generation.
3. Three things to do right after
This is compile-time only. Runtime still needs JSON Schema or zod-like checks. Format the JSON first so trailing commas and comments do not break parsing.
- Generate again from a second real response and diff the types to catch sporadic fields.
- Tighten any/unknown into unions or enums at the boundary.
- Reuse the same JSON for JSON→Go / JSON→Java when other languages need the shape.
4. Strategies for converging inferred types
The inherent limit of generating TypeScript types from one sample is overfitting: a field that is a number in your sample may be null in real data. Two convergence paths work in practice: multi-sample union (feed several real responses so field types union together and nullability surfaces automatically) and permissive mode (unknown placeholders, tightened progressively). This tool offers both depths: strict for stable third-party APIs, permissive (optional markers plus null unions) for your own evolving interfaces. Heterogeneous arrays are the other fork — inconsistent element shapes call for either union types or a discriminated union (a kind tag), and one-click tools can only pick the former; the latter needs human design.
5. Downstream uses of generated types
- Types are compile-time contracts only; runtime validation (zod/valibot deriving schemas from types) is the actual boundary defense — they complement, not replace.
- For services with OpenAPI, generate from the schema first (openapi-typescript); sample-based generation is the fallback for undocumented APIs.
- Split large generated results into domain files and curate manually — a single thousand-line types.d.ts approaches zero maintainability.
6. Sample coverage and acceptance
Regenerate from at least two real responses and diff types for intermittent fields. Empty arrays become unknown[]; heterogeneous elements become unions. Types are compile-time only — keep runtime validation. Rename nested interfaces to domain terms. Prefer OpenAPI generators when a schema exists.
FAQ
Yes. Type inference runs entirely on your machine and nothing leaves your browser. If a production response carries sensitive fields, sanitizing it first is the safer move.
Yes. Nested objects become standalone types named after their key (address → Address, users → User) — renaming them to domain terms after generation pays off. Object arrays with a uniform shape merge into one type, with optional fields for missing keys; empty arrays fall back to unknown[].
Every element is scanned. Mixed primitives produce a union type like (string | number)[]; same-shape objects merge into a single interface, with fields that appear in only some elements marked optional; conflicting types on shared keys fall back to a union of element types for manual splitting.
Interface or type output, optional export, and three optionality strategies — all optional, all required, or smart, which leans optional based on null/undefined and fits real response samples. Null handling offers any / unknown / mark as optional. Inference quality tracks sample quality: if a field is sometimes missing, show that in the sample or it becomes required.
No. Types apply at compile time only — this tool doesn't validate anything at runtime. Defend your boundaries with JSON Schema or zod (which can derive a schema from the type); the two approaches complement rather than replace each other.
With a schema, generate from it first (openapi-typescript and similar); this page is the fallback for undocumented endpoints. After generating, run a second real response through the tool and diff the two types to catch occasional fields, then converge any/unknown into business unions or enums.
Related Tools
Related Articles
JSON to TypeScript: Complete Guide to Auto-Generating Type Definitions
Step-by-step tutorial on how to quickly convert JSON data to TypeScript interfaces and type definitions, boosting development efficiency and code quality
JSON Integer Precision Trap: When Snowflake IDs Are Silently Rewritten
JSON numbers beyond 2^53-1 are rounded by JSON.parse. Compare naive formatters with a lossless path, and cross-link JWT, Base64, and this site’s JSON tools.
JSON Parse Error 'Unexpected token'? 5 Common Causes and How to Fix Them
Getting a JSON parse error 'Unexpected token'? This article covers the 5 most common causes of JSON format errors — trailing commas, single quotes, unescaped characters, BOM headers, and comments — with fixes and code examples for each.