JSON to TypeScript
Generate TypeScript interfaces from JSON
Paste JSON and generate TypeScript types first; optional-field and readonly strategies are available in Advanced mode.
The full guide also includes pitfalls, worked examples, snippets, FAQs, and related tools for checking results or troubleshooting.
About this tool
Generate an interface or type-alias draft from one JSON sample. Nested objects get named declarations; array item types are combined into unions. Optional nullable marks null-valued properties optional, and Readonly adds property modifiers. Root arrays and scalars are wrapped in a value property. Review and compile the result against the real API contract. The input draft is stored locally in this browser.
Production Snippets
Null and optional are separate decisions
text
Input JSON:
{"note":null,"active":true}
Default: interface; Optional nullable on
Output:
export interface Root {
note?: null;
active: boolean;
}Failure Clinic (Common Pitfalls)
A generated question mark is mistaken for an API requirement
Cause: The tool marks observed null values optional when the option is enabled. It cannot infer missing-field rules from one sample, and it does not merge array object shapes into one interface.
Fix: Review the draft against the API contract. Run the TypeScript compiler and correct unusual property names, generated-name collisions, and any required unions.
Frequently Asked Questions
What does a generated type represent?
It is a draft inferred from the supplied JSON values, not an API contract or runtime validator. Nested objects get named declarations. Different object items in an array get separate item types combined into a union; absent fields are not merged into one optional-field interface.
How are null and missing fields handled?
With Optional nullable enabled by default, a null property becomes optional and still has type null, such as note?: null. Turning it off gives note: null. A single sample cannot establish whether the API permits missing fields or other values.
What happens to root arrays and scalars?
They are wrapped in a Root declaration with a value property. An empty array becomes unknown[]. This wrapper describes the generated draft, not an extra property in the original JSON.
Can I paste the output directly into production code?
Review names, property syntax, nullability, unions, and API semantics, then run the TypeScript compiler. Some unusual names or generated-name collisions need manual correction. Generation is local, and the input draft is saved in this browser.
Keep browsing